Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion .cspell.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,17 @@
"cachable",
"finalhandler",
"hono",
"rspack"
"rspack",
"rstackjs",
"sokra"
],
"ignorePaths": [
"CHANGELOG.md",
"package.json",
"dist/**",
"**/__snapshots__/**",
"package-lock.json",
"pnpm-lock.yaml",
"node_modules",
"coverage",
"*.log",
Expand Down
31 changes: 19 additions & 12 deletions .github/workflows/nodejs.yml
Original file line number Diff line number Diff line change
Expand Up @@ -35,30 +35,32 @@ jobs:
with:
fetch-depth: 0

- name: Install Pnpm
run: |
npm install -g corepack@latest --force
corepack enable

- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v6
with:
node-version: ${{ matrix.node-version }}
cache: "npm"
package-manager-cache: false

- name: Install dependencies
run: npm ci
run: pnpm install --frozen-lockfile

- name: Lint
run: npm run lint
run: pnpm run lint

- name: Build types
run: npm run build:types
run: pnpm run build:types

- name: Check types
run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'npm run build:types'"; exit 1; else echo "All types are valid"; fi

- name: Security audit
run: npm run security
run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'pnpm run build:types'"; exit 1; else echo "All types are valid"; fi

- name: Validate PR commits with commitlint
if: github.event_name == 'pull_request'
run: npx commitlint --from ${{ github.event.pull_request.head.sha }}~${{ github.event.pull_request.commits }} --to ${{ github.event.pull_request.head.sha }} --verbose
run: pnpm exec commitlint --from ${{ github.event.pull_request.head.sha }}~${{ github.event.pull_request.commits }} --to ${{ github.event.pull_request.head.sha }} --verbose

Comment on lines +59 to 64
test:
name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack ${{ matrix.webpack-version }}
Expand All @@ -78,17 +80,22 @@ jobs:
steps:
- uses: actions/checkout@v6

- name: Install Pnpm
run: |
npm install -g corepack@latest --force
corepack enable

- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v6
with:
node-version: ${{ matrix.node-version }}
cache: "npm"
package-manager-cache: false

- name: Install dependencies
run: npm ci
run: pnpm install --frozen-lockfile

- name: Run tests for webpack version ${{ matrix.webpack-version }}
run: npm run test:coverage -- --ci
run: pnpm run test:coverage -- --ci

- name: Submit coverage data to codecov
uses: codecov/codecov-action@v5
Expand Down
44 changes: 25 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,18 @@ Some of the benefits of using this middleware include:

First thing's first, install the module:

```console
```bash
# npm
npm install @rspack/dev-middleware -D

# pnpm
pnpm add -D @rspack/dev-middleware

# yarn
yarn add -D @rspack/dev-middleware

# bun
bun add -D @rspack/dev-middleware
```

> [!WARNING]
Expand All @@ -39,9 +49,9 @@ npm install @rspack/dev-middleware -D
## Usage

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");
const middleware = require("@rspack/dev-middleware");

const compiler = webpack({
// webpack options
Expand Down Expand Up @@ -332,15 +342,14 @@ Required: `No`
A function executed once the middleware has stopped watching.

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");

const compiler = webpack({
/* Webpack configuration */
});

const middleware = require("@rspack/dev-middleware");

const instance = middleware(compiler);

// eslint-disable-next-line new-cap
Expand Down Expand Up @@ -368,15 +377,14 @@ Required: `No`
A function executed once the middleware has invalidated.

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");

const compiler = webpack({
/* Webpack configuration */
});

const middleware = require("@rspack/dev-middleware");

const instance = middleware(compiler);

// eslint-disable-next-line new-cap
Expand Down Expand Up @@ -409,15 +417,14 @@ A function executed when the bundle becomes valid.
If the bundle is valid at the time of calling, the callback is executed immediately.

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");

const compiler = webpack({
/* Webpack configuration */
});

const middleware = require("@rspack/dev-middleware");

const instance = middleware(compiler);

// eslint-disable-next-line new-cap
Expand All @@ -444,15 +451,14 @@ Required: `Yes`
URL for the requested file.

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");

const compiler = webpack({
/* Webpack configuration */
});

const middleware = require("@rspack/dev-middleware");

const instance = middleware(compiler);

// eslint-disable-next-line new-cap
Expand All @@ -476,9 +482,9 @@ Since `output.publicPath` and `output.filename`/`output.chunkFilename` can be dy
But there is a solution to avoid it - mount the middleware to a non-root route, for example:

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");
const middleware = require("@rspack/dev-middleware");

const compiler = webpack({
// webpack options
Expand Down Expand Up @@ -517,10 +523,10 @@ process is finished with server-side rendering enabled._
Example Implementation:

```js
const middleware = require("@rspack/dev-middleware");
const express = require("express");
const isObject = require("is-object");
const webpack = require("webpack");
const middleware = require("@rspack/dev-middleware");

const compiler = webpack({
/* Webpack configuration */
Expand Down Expand Up @@ -606,9 +612,9 @@ Examples of use with other servers will follow here.

```js
const http = require("node:http");
const devMiddleware = require("@rspack/dev-middleware");
const connect = require("connect");
const webpack = require("webpack");
const devMiddleware = require("@rspack/dev-middleware");
const webpackConfig = require("./webpack.config.js");

const compiler = webpack(webpackConfig);
Expand All @@ -626,10 +632,10 @@ http.createServer(app).listen(3000);

```js
const http = require("node:http");
const devMiddleware = require("@rspack/dev-middleware");
const finalhandler = require("finalhandler");
const Router = require("router");
const webpack = require("webpack");
const devMiddleware = require("@rspack/dev-middleware");
const webpackConfig = require("./webpack.config.js");

const compiler = webpack(webpackConfig);
Expand All @@ -652,9 +658,9 @@ server.listen(3000);
### Express

```js
const devMiddleware = require("@rspack/dev-middleware");
const express = require("express");
const webpack = require("webpack");
const devMiddleware = require("@rspack/dev-middleware");
const webpackConfig = require("./webpack.config.js");

const compiler = webpack(webpackConfig);
Expand All @@ -671,9 +677,9 @@ app.listen(3000, () => console.log("Example app listening on port 3000!"));
### Koa

```js
const middleware = require("@rspack/dev-middleware");
const Koa = require("koa");
const webpack = require("webpack");
const middleware = require("@rspack/dev-middleware");
const webpackConfig = require("./webpack.simple.config");

const compiler = webpack(webpackConfig);
Expand All @@ -691,8 +697,8 @@ app.listen(3000);

```js
const Hapi = require("@hapi/hapi");
const webpack = require("webpack");
const devMiddleware = require("@rspack/dev-middleware");
const webpack = require("webpack");
const webpackConfig = require("./webpack.config.js");

const compiler = webpack(webpackConfig);
Expand Down Expand Up @@ -724,9 +730,9 @@ process.on("unhandledRejection", (err) => {
Fastify interop will require the use of `fastify-express` instead of `middie` for providing middleware support. As the authors of `fastify-express` recommend, this should only be used as a stopgap while full Fastify support is worked on.

```js
const devMiddleware = require("@rspack/dev-middleware");
const fastify = require("fastify")();
const webpack = require("webpack");
const devMiddleware = require("@rspack/dev-middleware");
const webpackConfig = require("./webpack.config.js");

const compiler = webpack(webpackConfig);
Expand All @@ -743,9 +749,9 @@ await fastify.listen(3000);

```js
import { serve } from "@hono/node-server";
import devMiddleware from "@rspack/dev-middleware";
import { Hono } from "hono";
import webpack from "webpack";
import devMiddleware from "@rspack/dev-middleware";
import webpackConfig from "./webpack.config.js";

const compiler = webpack(webpackConfig);
Expand Down
Loading
Loading