Skip to content

Commit 5e97fa9

Browse files
committed
Fill in the readme.
1 parent 440d099 commit 5e97fa9

File tree

1 file changed

+111
-1
lines changed

1 file changed

+111
-1
lines changed

README.md

Lines changed: 111 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,114 @@
22

33
A [Vite](https://vitejs.dev/) plugin for [Scala.js](https://www.scala-js.org/).
44

5-
Work in progress.
5+
## Usage
6+
7+
We assume that you have an existing Vite and Scala.js sbt project.
8+
If not, [follow the accompanying tutorial](https://github.com/scala-js/scala-js-website/pull/590).
9+
10+
Install the plugin as a development dependency:
11+
12+
```shell
13+
$ npm install -D @scala-js/vite-plugin-scalajs
14+
```
15+
16+
Tell Vite to use the plugin in `vite.config.js`:
17+
18+
```javascript
19+
import { defineConfig } from "vite";
20+
import scalaJSPlugin from "@scala-js/vite-plugin-scalajs";
21+
22+
export default defineConfig({
23+
plugins: [scalaJSPlugin()],
24+
});
25+
```
26+
27+
Finally, import the Scala.js output from a `.js` or `.ts` file with
28+
29+
```javascript
30+
import 'scalajs:main.js';
31+
```
32+
33+
which will execute the main method of the Scala.js application.
34+
35+
The sbt project must at least be configured to use ES modules.
36+
For the best feedback loop with Vite, we recommend to emit small modules for application code.
37+
If your application lives in the `my.app` package, configure the sbt project with the following settings:
38+
39+
```scala
40+
scalaJSLinkerConfig ~= {
41+
_.withModuleKind(ModuleKind.ESModule)
42+
.withModuleSplitStyle(
43+
ModuleSplitStyle.SmallModulesFor(List("my.app")))
44+
},
45+
```
46+
47+
## Configuration
48+
49+
The plugin supports the following configuration options:
50+
51+
```javascript
52+
export default defineConfig({
53+
plugins: [
54+
scalaJSPlugin({
55+
// path to the directory containing the sbt build
56+
// default: '.'
57+
cwd: '.',
58+
59+
// sbt project ID from within the sbt build to get fast/fullLinkJS from
60+
// default: the root project of the sbt build
61+
projectID: 'client',
62+
}),
63+
],
64+
});
65+
```
66+
67+
## Importing `@JSExportTopLevel` Scala.js members
68+
69+
`@JSExportTopLevel("foo")` members in the Scala.js code are exported from the modules that Scala.js generate.
70+
They can be imported in `.js` and `.ts` files with the usual JavaScript `import` syntax.
71+
72+
For example, given the following Scala.js definition:
73+
74+
```scala
75+
import scala.scalajs.js
76+
import scala.scalajs.js.annotation._
77+
78+
@JSExportTopLevel("square")
79+
class ScalaJSLib extends js.Object {
80+
def square(x: Double): Double = x * x
81+
}
82+
```
83+
84+
we can import and use it as
85+
86+
```javascript
87+
import { ScalaJSLib } from 'scalajs:main.js';
88+
89+
const lib = new ScalaJSLib();
90+
console.log(lib.square(5)); // 25
91+
```
92+
93+
### Exports in other modules
94+
95+
By default, `@JSExportTopLevel("Foo")` exports `Foo` from the `main` module, which is why we import from `scalajs:main.js`.
96+
We can also split the Scala.js exports in several modules.
97+
For example,
98+
99+
```scala
100+
import scala.scalajs.js
101+
import scala.scalajs.js.annotation._
102+
103+
@JSExportTopLevel("square", "library")
104+
class ScalaJSLib extends js.Object {
105+
def square(x: Double): Double = x * x
106+
}
107+
```
108+
109+
can be imported with
110+
111+
```javascript
112+
import { ScalaJSLib } from 'scalajs:library.js';
113+
```
114+
115+
The Scala.js documentation contains [more information about module splitting](https://www.scala-js.org/doc/project/module.html).

0 commit comments

Comments
 (0)