Commit fc7974da authored by Rahix's avatar Rahix 🦀

Merge 'fix svg level loader tsc hack'

See merge request !58
parents a66d413f b8f57e34
......@@ -27,11 +27,10 @@ build-dev:
<<: *global_cache
key: merge-requests
script:
- RUSTFLAGS=-Dwarnings wasm-pack build --dev
- cd www
- rm -f node_modules/engel-simulator-2020
- npm install
- npm run rust-web-modules
- npm run build
- RUSTFLAGS=-Dwarnings npm run build -- --mode development
only:
- merge_requests
......@@ -43,10 +42,8 @@ build-release:
key: release-build
script:
- touch .git/HEAD
- wasm-pack build
- cd www
- npm install
- npm run rust-web-modules
- npm run build
artifacts:
paths:
......
......@@ -92,25 +92,25 @@ cd www/ && npm install
```
## Development Environment
Open two shell sessions, one for the rust build and one for the webpack dev
server:
The following will take care of watching for rust and js/ts changes and reloading the browser on change:
```sh
cd www/
npm run start
```
> Note: under the hood something like this is called to watch for rust changes:
```bash
# For Rust:
cargo watch -s "wasm-pack build --dev" --watch src
# or, if you don't use cargo-watch, just run
wasm-pack build --dev
# For the webpack dev server:
cd www/
npm run rust-web-modules
npm run start
```
Then point your browser to `http://localhost:8080` and start hacking! The
website will automatically reload when any changes are done to the web sources
(`www/`) or the Rust sources (`src/`). If you change the `rust-web-modules/`
you'll have to manually run `npm run rust-web-modules` again (please fix!).
(`www/`) or the Rust sources (`src/`).
## Level Design
We're using an _Inkscape SVG_ file as the level format (yes, the inkscape
......
......@@ -8,7 +8,7 @@ use crate::utils;
// rustfmt skip because of a bug where rustfmt removes the `async` keyword ...
#[rustfmt::skip]
#[wasm_bindgen(raw_module = "./svg-level-loader")]
#[wasm_bindgen(raw_module = "../rust-web-modules/svg-level-loader")]
extern "C" {
async fn load_svg(url: &str) -> JsValue;
fn clean_svg(loading_id: &str);
......
......@@ -115,6 +115,29 @@
}
}
},
"@wasm-tool/wasm-pack-plugin": {
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/@wasm-tool/wasm-pack-plugin/-/wasm-pack-plugin-1.3.3.tgz",
"integrity": "sha512-CJuluHW6JbUJoNfHj1VGZj11IS4mPK8gMmfW+/EPNViFnrzcHt6a9csG+BTyh0lw4gnzME4/nzAM7ZEiRYTUfw==",
"dev": true,
"requires": {
"chalk": "^2.4.1",
"command-exists": "^1.2.7",
"watchpack": "^1.6.0",
"which": "^2.0.2"
},
"dependencies": {
"which": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
"dev": true,
"requires": {
"isexe": "^2.0.0"
}
}
}
},
"@webassemblyjs/ast": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.9.0.tgz",
......@@ -1084,6 +1107,12 @@
"integrity": "sha512-puCDz0CzydiSYOrnXpz/PKd69zRrribezjtE9yd4zvytoRc8+RY/KJPvtPFKZS3E3wP6neGyMe0vOTlHO5L3Pw==",
"dev": true
},
"command-exists": {
"version": "1.2.9",
"resolved": "https://registry.npmjs.org/command-exists/-/command-exists-1.2.9.tgz",
"integrity": "sha512-LTQ/SGc+s0Xc0Fu5WaKnR0YiygZkm9eKFvyS+fRsU7/ZWFF8ykFM6Pc9aCVf1+xasOOZpO3BAVgVrKvsqKHV7w==",
"dev": true
},
"commander": {
"version": "2.20.3",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
......
......@@ -2,12 +2,10 @@
"name": "engel-simulator-2020",
"version": "0.1.0",
"description": "TODO",
"main": "index.js",
"main": "index.ts",
"scripts": {
"build": "webpack --config webpack.config.js",
"start": "webpack-dev-server",
"all": "wasm-pack build && webpack-dev-server",
"rust-web-modules": "tsc ../rust-web-modules/svg-level-loader.ts --outFile ../pkg/svg-level-loader.js --module amd --moduleResolution node"
"start": "webpack-dev-server --mode development"
},
"author": "Rahix <rahix@rahix.de>",
"license": "GPL-3.0-or-later",
......@@ -15,6 +13,7 @@
"engel-simulator-2020": "file:../pkg"
},
"devDependencies": {
"@wasm-tool/wasm-pack-plugin": "^1.3.3",
"clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^5.0.0",
"css-loader": "^5.0.1",
......
// A dependency graph that contains any wasm must all be imported
// asynchronously. This `bootstrap.js` file does the single async import, so
// that no one else needs to worry about it again.
import("./index.ts").catch((e) =>
console.error("Error importing `index.js`:", e)
);
// @ts-ignore
import * as wasm from "engel-simulator-2020";
import "./styles.scss";
wasm.start();
// only the wasm module needs to be loaded async,
// all other resources might be better loaded synchronously
import("engel-simulator-2020").then((wasm) => {
(window as any).cheats = Object.assign(
{},
...Object.keys(wasm)
.filter((f) => f.startsWith("cheat_"))
.map((f) => ({[f.substr(6)]: (wasm as any)[f]}))
);
wasm.start();
(window as any).cheats = Object.assign(
{},
...Object.keys(wasm)
.filter((f) => f.startsWith("cheat_"))
.map((f) => ({[f.substr(6)]: (wasm as any)[f]}))
);
});
const path = require("path");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const WasmPackPlugin = require('@wasm-tool/wasm-pack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
entry: "./src/bootstrap.js",
entry: "./src/index.ts",
output: {
path: path.resolve(__dirname, "dist"),
filename: "bundle.js",
},
mode: "development",
plugins: [
new WasmPackPlugin({crateDirectory: path.resolve(__dirname, "..")}),
new CleanWebpackPlugin(),
new CopyWebpackPlugin([
"src/index.html",
{ from: "resources/", to: "resources/" },
]),
],
resolve: {
extensions: ['.ts', '.js']
},
module: {
rules: [
{
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment