Skip to content

KidkArolis/jetpack

Repository files navigation

jetpack

Run and build web code with Rspack.


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 build

Jetpack requires Node 20 or newer and is published as ESM.

What You Get

  • 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

Usage

Start a dev server on http://localhost:3030:

jetpack

Build into dist/:

jetpack build

Point Jetpack at another file or project:

jetpack ~/Desktop/magic.js
jetpack --dir ~/projects/app

Inspect, clean, or check browser targets:

jetpack inspect
jetpack clean --dry-run
jetpack browsers --coverage=GB

Configuration

Most 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
  }
})

API Servers

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 }))

Docs

Packages

 
 
 

Contributors