Registry / devops / dn-middleware-webpack5

dn-middleware-webpack5

library1.1.36jsnpmunverified

A Dawn middleware that wraps Webpack 5 for building web applications, part of the Dawn toolkit by Alibaba. Version 1.1.36 (stable, last published 2022) provides full Webpack 5 support including Module Federation, Fast Refresh, ESBuild minification, and smart defaults for entry, output, and TypeScript compilation. Designed specifically for the Dawn pipeline (pipe.yml) workflow, it simplifies configuration by auto-detecting project structure. Compared to standalone Webpack usage, this middleware integrates with Dawn's task runner, server, and browser-sync plugins. Release cadence is low; maintained by Alibaba team. Requires Node.js >=10.13.

devops web-framework

npm install dn-middleware-webpack5

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · DN-MIDDLEWARE-WEBP

dn-middleware-webpack5

devopsjavascriptv1.1.36

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

webpack5

✓ name: webpack5

✗ name: webpack

In Dawn pipe.yml, use 'webpack5' as the middleware name, not 'webpack', to invoke this package.

env

✓ env: "production"

✗ env: "prod"

Valid env values are 'development' (default) or 'production', not other aliases.

esbuild.minify

✓ esbuild: minify: true

✗ esbuild: minify: { config: true }

esbuild.minify accepts boolean or object; object is passed directly to ESBuildMinifyPlugin options.

moduleFederation

✓ moduleFederation: name: 'myapp' remotes: {} exposes: {}

✗ moduleFederation: 'myapp'

moduleFederation expects an object with standard Webpack ModuleFederationPlugin options, not a string.

Basic setup of webpack5 middleware in Dawn pipeline config files for development with hot reload and production build.

# Install the middleware - remove old webpack middleware if upgrading npm uninstall dn-middleware-webpack -D && npm install dn-middleware-webpack5 -D # pipe.yml example for development # .dawn/pipe.yml dev: - name: webpack5 watch: true env: development entry: src/index.tsx template: public/index.html - name: server - name: browser-sync # pipe.yml example for production build build: - name: webpack5 env: production compress: true devtool: false output: /build

Debug

Known issues

gotchaEnsure compress option is set to false if using a separate compress middleware to avoid double compression.

fix

Set compress: false in webpack5 config when using another compress middleware.

affects: >=0.0.0

deprecatedThe sourceMap option (v4) has been replaced by devtool. Using sourceMap may still work but is discouraged.

fix

Use devtool option instead of sourceMap.

affects: >=1.0.0

gotchaIn production mode, compression is enabled by default. If you want to customize Terser or use esbuild.minify, set compress to false first.

fix

Set compress: false and then configure terser or esbuild.minify as needed.

affects: >=0.0.0

gotchaModule Federation configuration must be an object; passing a string or boolean will throw an error.

fix

Ensure moduleFederation is an object with valid Webpack ModuleFederationPlugin options.

affects: >=0.0.0

breakingMigration from dn-middleware-webpack (Webpack 4) to dn-middleware-webpack5 requires removing the old package and updating pipe.yml to use 'webpack5' name.

fix

npm uninstall dn-middleware-webpack -D && npm install dn-middleware-webpack5 -D, then change pipe.yml middleware name from 'webpack' to 'webpack5'.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'webpack'

webpack is not installed as a dependency or peer dependency.

fix

Run 'npm install webpack --save-dev' to install webpack as a dev dependency.

Error: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

A configuration option is misspelled or has an incorrect type (e.g., compress set to a string instead of boolean).

fix

Check the webpack5 configuration in pipe.yml for typos or wrong types. Refer to the documentation for valid options.

Error: Module not found: Error: Can't resolve 'src/index'

Default entry src/index was not found; auto-detection failed.

fix

Set entry explicitly in pipe.yml to the correct path, e.g., entry: src/index.tsx

Error: Cannot find module '@dawnjs/dn-middleware-babel'

Babel middleware is missing but required for TypeScript/React transpilation.

fix

Install '@dawnjs/dn-middleware-babel' as a dev dependency.

Upgrade

Version history

1.1.36latest on npm

Audit

Dependencies

@dawnjs/dn-middleware-babeloptionalBabel integration for transpilation; configured via jsxRuntime option

webpackoptionalCore Webpack 5 bundler; peer dependency expected

Agent activity

16 hits · last 30 days

node

Resources

githubhttps://github.com/alibaba/dawn ↗

packagehttps://www.npmjs.com/package/dn-middleware-webpack5 ↗

homepagehttp://alibaba.github.io/dawn ↗