This crate aims to provide an easy and customizable way to help you build
Wasm projects by extending them with custom subcommands, based on the
xtask concept, instead of using
external tooling like wasm-pack.
This crate requires Rust 1.58.1 at a minimum because there is a security issue on a function we use from std in previous version (see cve-2022-21658).
The best way to add xtask-wasm to your project is to create a workspace with two packages: your project's package and the xtask package.
Create a new directory that will contains the two package of your project
and the workspace's Cargo.toml:
console
mkdir my-project
cd my-project
touch Cargo.toml
Create the project package and the xtask package using cargo new:
console
cargo new my-project
cargo new xtask
Open the workspace's Cargo.toml and add the following:
toml
[workspace]
default-members = ["my-project"]
members = [
"my-project",
"xtask",
]
Create a .cargo/config.toml file and add the following content:
toml
[alias]
xtask = "run --package xtask --"
The directory layout should look like this:
console
project
├── .cargo
│ └── config.toml
├── Cargo.toml
├── my-project
│ ├── Cargo.toml
│ └── src
│ └── ...
└── xtask
├── Cargo.toml
└── src
└── main.rs
And now you can run your xtask package using:
console
cargo xtask
You can find more informations about xtask here.
Finally, add the following to the xtask package's Cargo.toml:
toml
[dependencies]
xtask-wasm = "0.1.1"
This library gives you three structs:
Dist - Generate a distributed package for Wasm.Watch -
Re-run a given command when changes are detected
(using xtask-watch).DevServer - Serve your project at a given IP address.They all implement clap::Parser
allowing them to be added easily to an existing CLI implementation and are
flexible enough to be customized for most use-cases.
You can find further information for each type at their documentation level.
```rust use std::process::Command; use xtaskwasm::{anyhow::Result, clap, defaultdist_dir};
enum Opt { Dist(xtaskwasm::Dist), Watch(xtaskwasm::Watch), Start(xtask_wasm::DevServer), }
fn main() -> Result<()> { let opt: Opt = clap::Parser::parse();
match opt {
Opt::Dist(dist) => {
log::info!("Generating package...");
dist
.dist_dir_path("dist")
.static_dir_path("my-project/static")
.app_name("my-project")
.run_in_workspace(true)
.run("my-project")?;
}
Opt::Watch(watch) => {
log::info!("Watching for changes and check...");
let mut command = Command::new("cargo");
command.arg("check");
watch.run(command)?;
}
Opt::Start(mut dev_server) => {
log::info!("Starting the development server...");
dev_server.arg("dist").start(default_dist_dir(false))?;
}
}
Ok(())
} ```
examples/demoProvides a basic implementation of xtask-wasm to generate the web app
package, an "hello world" app using Yew. This example
demonstrates a simple directory layout and a customized dist process
that use the wasm-opt feature.
The available subcommands are:
Build the web app package.
console
cargo xtask dist
wasm-opt
binary and optimize the Wasm generated by the dist process.console
cargo xtask dist --optimize
Build the web app package and watch for changes in the workspace root.
console
cargo xtask watch
Serve an optimized web app dist on 127.0.0.1:8000 and watch for
changes in the workspace root.
console
cargo xtask start
Additional flags can be found using cargo xtask <subcommand> --help.
This example also demonstrates the use of the run-example feature that allows you to use the
following:
console
cargo run --example run_example
This command will run the code in examples/run_example using the development server.