vite-plugin-moonbit

0.2.1 verified Mon Apr 27 auth: no javascript

Vite plugin for MoonBit that allows importing MoonBit modules with the mbt: prefix. Current stable version is 0.2.1. It supports JS and WASM-GC backends, auto-starts moon build --watch, provides HMR on file changes, source maps for .mbt files, and supports MoonBit workspaces/monorepos. Key differentiators include a MoonBit-native DSL parser for moon.pkg/moon.work, query suffixes (?worker, ?url, ?raw), experimental TypeScript bridge generation via mizchi/ts.mbt, and the ability to mix multiple backends in one project. It requires vite >=5.0.0 and ships TypeScript types.

Common errors

error TypeError: moonbit is not a function ↓

cause Using default import instead of named import.

fix

Change to: import { moonbit } from 'vite-plugin-moonbit'

error Cannot find module 'mbt:username/app' or its corresponding type declarations. ↓

cause TypeScript cannot resolve the mbt: prefix without path mappings.

fix

Add to tsconfig.json compilerOptions.paths: { "mbt:*": ["./node_modules/vite-plugin-moonbit/types/mbt.d.ts"] }

error Error: moon build command failed with exit code 1 ↓

cause MoonBit build failed; often due to missing moon toolchain or incorrect target.

fix

Ensure 'moon' is installed and run 'moon build --target js' manually to see detailed errors.

Warnings

breaking Default export removed in v0.2.0. Previously 'import moonbit from ...' now yields undefined. ↓

fix Use named import: import { moonbit } from 'vite-plugin-moonbit'

deprecated The 'target' option previously accepted 'wasm' as an alias for 'wasm-gc'. This alias is deprecated and may be removed. ↓

fix Use 'wasm-gc' explicitly instead of 'wasm'.

gotcha TypeScript path mappings must be manually configured for IntelliSense to resolve mbt: imports. Without them, TypeScript may complain about missing modules. ↓

fix Add to tsconfig.json: {"compilerOptions": {"paths": {"mbt:*": ["./node_modules/vite-plugin-moonbit/types/mbt.d.ts"]}}}

gotcha The tsBridge option is experimental and may change in future releases. Generated bridge packages may require manual adjustments. ↓

fix Review generated bridge code and pin plugin version if stability is critical.

Install

npm install vite-plugin-moonbit

yarn add vite-plugin-moonbit

pnpm add vite-plugin-moonbit

Imports

moonbit
wrong
```
import moonbit from 'vite-plugin-moonbit'
```
correct
```
import { moonbit } from 'vite-plugin-moonbit'
```
The plugin exports a named export 'moonbit'. Default import is not available; using it will result in undefined.
MoonbitPluginOptions
wrong
```
import { MoonbitPluginOptions } from 'vite-plugin-moonbit'
```
correct
```
import { type MoonbitPluginOptions } from 'vite-plugin-moonbit'
```
Type imports require the 'type' modifier in TypeScript with isolatedModules enabled. This is a type exported for TypeScript users.
MoonbitTsBridgeOptions
```
import { type MoonbitTsBridgeOptions } from 'vite-plugin-moonbit'
```
Type export for the experimental tsBridge option. Available since v0.2.1.

Quickstart

Basic setup with JS backend: configure Vite plugin, then import MoonBit modules using the mbt: prefix.

// vite.config.ts
import { defineConfig } from 'vite';
import { moonbit } from 'vite-plugin-moonbit';

export default defineConfig({
  plugins: [
    moonbit({
      target: 'js',
      watch: true,
      showLogs: true,
      prefix: 'mbt:',
    })
  ],
});

// main.ts
import { greet } from 'mbt:username/app';

greet();