Package Exports

vite-plugin-wasm-pack

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vite-plugin-wasm-pack) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

🚚 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
# or
# npm 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
#npm run dev

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
# or
# npm i vite vite-plugin-wasm-pack vite -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
  },
  // pass your crate path to the plugin
  plugins: [wasmPack('./my-crate')]
});

⚠ Don't forget to build your wasm-pack crate first!

wasm-pack build ./my-crate --target web

Add command to package.json

"scripts": {
  "dev": "vite",
  "build": "vite build"
}

Start dev server, and install my-crate that you build earlier.

yarn dev

Complete example

please check ./example folder.

License

MIT, see the license file