🦀 vite-plugin-wasm-pack
🦀 Vite plugin for rust wasm-pack, it's simple.
Quick start
Make sure wasm-pack installed correctly.
Clone this repo or download the zip file, extract the example folder.
example
|
|-- my-crate # rust project folder, there is a Cargo.toml in it
|-- src # front end source code
| |-- index.ts # entry point
|-- index.html # html entry
|-- vite.config.ts # vite config file
|__ package.json # npm config file
Install npm develop dependencies, in example folder run:
yarn install
After that you can build rust project
to WebAassembly
by using wasm-pack
.
wasm-pack build ./my-crate --target web
Now the my-crate
module is ready, start vite dev server.
yarn dev
or
Done, if below is showing.
vite v2.3.8 dev server running at:
> Local: http://localhost:3000/
ready in 169ms.
Install manually
yarn add vite vite-plugin-wasm-pack -D
Usage
Add this plugin to vite.config.ts
import { defineConfig } from 'vite';
import wasmPack from 'vite-plugin-wasm-pack';
export default defineConfig({
build: {
minify: false
},
plugins: [wasmPack('./my-crate')]
});
Add script to package.json
"scripts": {
"dev": "vite",
"build": "vite build"
}
⚠ Don't forget to build your wasm-pack crate first!
wasm-pack build ./my-crate --target web
Tips: you can add a wasm
script to package.json
like this:
"scripts": {
"wasm": "wasm-pack build ./my-crate --target web",
"dev": "yarn wasm && vite",
"build": "vite build"
}
Then, run:
yarn dev
This will start dev server, and install my-crate
that you built earlier.
Examples
License
MIT, see the license file