summaryrefslogtreecommitdiffstats
path: root/web/README.md
diff options
context:
space:
mode:
authorLibravatar Héctor Ramón Jiménez <hector0193@gmail.com>2019-11-20 10:54:32 +0100
committerLibravatar Héctor Ramón Jiménez <hector0193@gmail.com>2019-11-20 10:54:32 +0100
commit409b2db994980879355dc8ce0d065500a545ca61 (patch)
treedb6cfb19c504f5cddb121f314af809a7e48a5c22 /web/README.md
parent4b94cf00351f09fa916ebb1d89e4cdf4622fd800 (diff)
downloadiced-409b2db994980879355dc8ce0d065500a545ca61.tar.gz
iced-409b2db994980879355dc8ce0d065500a545ca61.tar.bz2
iced-409b2db994980879355dc8ce0d065500a545ca61.zip
Add usage section to `iced_web`
Diffstat (limited to 'web/README.md')
-rw-r--r--web/README.md38
1 files changed, 38 insertions, 0 deletions
diff --git a/web/README.md b/web/README.md
index 8f97f79e..762f6c83 100644
--- a/web/README.md
+++ b/web/README.md
@@ -25,3 +25,41 @@ __Iced moves fast and the `master` branch can contain breaking changes!__ If
you want to learn about a specific release, check out [the release list].
[the release list]: https://github.com/hecrj/iced/releases
+
+## Usage
+The current build process is a bit involved, as [`wasm-pack`] does not currently [support building binary crates](https://github.com/rustwasm/wasm-pack/issues/734).
+
+Therefore, we instead build using the `wasm32-unknown-unknown` target and use the [`wasm-bindgen`] CLI to generate appropriate bindings.
+
+For instance, let's say we want to build the [`tour` example]:
+
+```
+cd examples
+cargo build --example tour --target wasm32-unknown-unknown
+wasm-bindgen ../target/wasm32-unknown-unknown/debug/examples/tour.wasm --out-dir tour --web
+```
+
+Then, we need to create an `.html` file to load our application:
+
+```html
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
+ <title>Tour - Iced</title>
+ </head>
+ <body>
+ <script type="module">
+ import init from "./tour/tour.js";
+
+ init('./tour/tour_bg.wasm');
+ </script>
+ </body>
+</html>
+```
+
+Finally, we serve it using an HTTP server and access it with our browser.
+
+[`wasm-pack`]: https://github.com/rustwasm/wasm-pack
+[`wasm-bindgen`]: https://github.com/rustwasm/wasm-bindgen
+[`tour` example]: ../examples/README.md#tour