●Change8

v5.107.0

📦 webpackView on GitHub →
✨ 13 features🐛 14 fixes🔧 19 symbols

Summary

This release introduces experimental TypeScript support via built-in Node.js features and significantly enhances CSS Modules capabilities, including scope hoisting support and improved source mapping/deduplication. New configuration options were added for controlling anonymous default export naming and HTML module extraction.

Migration Steps

  1. If you rely on anonymous default export functions/classes having a specific `.name` in webpack output, review settings for `module.generator.javascript.anonymousDefaultExportName`. It defaults to `true` for applications and `false` for libraries.
  2. If you use the function form of `generator.exportsConvention` for CSS modules, be aware it now accepts `string[]` as input.
  3. If using experimental TypeScript support (`experiments.typescript: true`), note that it only supports erasable TypeScript syntax (no JSX/`.tsx`, no `enum`, `namespace`, etc.). Use a TSX-capable loader for non-erasable syntax.

✨ New Features

  • Added `module.generator.javascript.anonymousDefaultExportName` option to control webpack's naming of anonymous default export functions/classes.
  • Support module concatenation (scope hoisting) for CSS modules with `text`, `css-style-sheet`, `style`, and `link` export types.
  • The `generator.exportsConvention` function form for CSS modules now accepts `string[]` in addition to `string`.
  • Added `linkInsert` hook to `CssLoadingRuntimeModule.getCompilationHooks(compilation)` to allow plugin developers to control stylesheet `<link>` insertion order.
  • Added `CssModulesPlugin.getCompilationHooks(compilation).orderModules` hook.
  • Added a `pure` parser option for `css/module` and `css/auto` types, enforcing that every selector must contain at least one local class or id, otherwise emitting a build error.
  • Support CSS Modules `@value` identifiers as `@import` URLs and inside `url()` functions.
  • Added experimental TypeScript support via `experiments.typescript: true` (auto-enabled by `experiments.futureDefaults`), using Node.js's built-in `module.stripTypeScriptTypes` for erasable TypeScript transformation.
  • Added an `experiments.html` flag to reserve the `html` module type for first-class HTML entry-point support.
  • Preserve `defer` / `source` import phase keywords on external dependencies in ESM output.
  • Support the `#__NO_SIDE_EFFECTS__` annotation to mark functions as pure for better tree-shaking.
  • Add `module.generator.html.extract` for HTML modules and matching filename templates, enabling HTML extraction alongside JavaScript export.
  • Added `"module-sync"` to default `conditionNames` for resolver defaults to align with Node.js ESM resolution.

🐛 Bug Fixes

  • Fixed CSS modules `composes` so that `composes: foo from "./self.module.css"` inside `self.module.css` no longer creates a duplicate module instance.
  • Fixed CSS modules `composes` parsing to track `local()` and `global()` function wrappers per class name.
  • Fixed CSS modules `composes: ... from "<file>"` to load composed files in an order consistent with every rule's local composes order.
  • Avoided emitting the `__webpack_require__` runtime in CSS bundles when all imported CSS modules were concatenated into the same scope.
  • Recomputed the CSS chunk's `[contenthash]` and rendered CSS bytes when an asset referenced by `url()`/`src()`/string in CSS changes its hashed filename.
  • Embedded an inline `sourceMappingURL` data URI inside the CSS when the `parser.exportType` options are `text`, `style`, or `css-style-sheet`.
  • Merged `@import`ed CSS at build time for `text` and `css-style-sheet` exportTypes to ship a single accurate inline source map.
  • Mapped each generated CSS-module class export line in the JS bundle back to its selector position in the original CSS file.
  • Fixed CSS modules deduplication when a `.module.<ext>` file is imported both directly (JS) and via icss (`composes from` / `:import`) to result in a single module instance.
  • Preserved `@charset` at-rule when CSS modules use `exportType: "text"`.
  • Resolved `[hash]`/`[fullhash]` placeholders in `output.publicPath` when generating `url()` references for `experiments.css`.
  • Fixed HMR for concatenated CSS modules with `style` exportType by using stable per-module identifiers for injected style elements and tracking inner module IDs in HMR records.
  • Fixed CSS Modules `@value` resolution when the same local name is imported from multiple modules.
  • Fixed `typeof ns.default` / `ns.default instanceof X` on a static `import defer * as ns from "./mod"` for `default-only` and `default-with-named` external modules under `optimization.concatenateModules`.

Affected Symbols

module.generator.javascript.anonymousDefaultExportName__webpack_require__.dngenerator.exportsConventionCssLoadingRuntimeModule.getCompilationHooksCssModulesPlugin.getCompilationHooksparser.pureCSS Modules @valueexperiments.typescriptmodule.stripTypeScriptTypesexperiments.htmldefer / source import phase keywords#__NO_SIDE_EFFECTS__module.generator.html.extractoutput.htmlFilenameoutput.htmlChunkFilenameconditionNamesCSS modules composesoutput.publicPathexperiments.css