Jetpack is preconfigured Rspack for web code: one command to start a dev server, one command to build production assets, and a config file only when you need it.
npm install -g jetpack
jetpack
jetpack buildJetpack requires Node 20 or newer and is published as ESM.
- JavaScript, TypeScript, JSX, CSS, SCSS, and assets
- SWC, core-js polyfills, and Lightning CSS
- Hot reloading, including React fast refresh
- Content-hashed production builds with code splitting and an asset manifest
- Optional modern/legacy differential builds
- Dev proxying, static serving middleware, and CSP nonce helpers
- A small config file when defaults are not enough
Start a dev server on http://localhost:3030:
jetpackBuild into dist/:
jetpack buildPoint Jetpack at another file or project:
jetpack ~/Desktop/magic.js
jetpack --dir ~/projects/appInspect, clean, or check browser targets:
jetpack inspect
jetpack clean --dry-run
jetpack browsers --coverage=GBMost projects do not need config. When you do, add jetpack.config.js, jetpack.config.mjs, or jetpack.config.cjs. Keep common app options top-level and put build/HTML shell settings under build and html.
import { defineConfig } from 'jetpack'
export default defineConfig({
entry: '.',
port: 3030,
assetBaseUrl: '/assets/',
dev: {
overlay: true
},
build: {
outDir: 'dist',
chunkLoadRetry: true
},
html: {
title: 'my-app'
},
css: {
modules: true
}
})Proxy API requests during development:
export default {
proxy: {
'/api/*': 'http://localhost:3000'
}
}Or mount Jetpack into your own server:
import { serve } from 'jetpack/serve'
app.use(serve())serve() resolves Jetpack config on the first request and caches the middleware. It uses process.cwd() as the default project directory, proxies to the Jetpack dev server outside production, and serves build.outDir in production. For monorepos, pass the client directory:
app.use(serve({ dir: clientDir }))