Skip to content

feat(asset): add [containedpath] and [containedfile] placeholders - #21592

Merged
alexander-akait merged 4 commits into
mainfrom
feat/asset-contained-path
Aug 3, 2026
Merged

feat(asset): add [containedpath] and [containedfile] placeholders#21592
alexander-akait merged 4 commits into
mainfrom
feat/asset-contained-path

Conversation

@alexander-akait

@alexander-akait alexander-akait commented Aug 3, 2026

Copy link
Copy Markdown
Member

Summary

Closes #14392. [path]/[file] of an asset module resolved outside of context (e.g. a hoisted node_modules in a workspace) start with .., so the asset is written outside of output.path. The new [containedpath]/[containedfile] placeholders replace an absolute root or a leading .. with _, as loader-utils did for file-loader, and [path]/[file] of asset modules behave the same way with experiments.futureDefaults (webpack 6 default).

What kind of change does this PR introduce?

feat

Did you add tests for your changes?

Yes — test/configCases/asset-modules/containedpath, test/configCases/asset-modules/path-outside-context-future-defaults and test/TemplatedPathPlugin.unittest.js (which also pins that [path]/[file] keep their .. without the flag).

Does this PR introduce a breaking change?

No. [path]/[file] only change under experiments.futureDefaults, where an asset of a module outside of context moves from outside output.path to _/… inside it. Only the templates deciding where the asset is written are affected — generator.publicPath is a url prefix and assetInfo.sourceFilename keep the real path.

If relevant, what needs to be documented once your changes are merged or what have you already documented?

The [containedpath]/[containedfile] placeholders in the template strings documentation, and the experiments.futureDefaults behaviour of [path]/[file] for asset modules.

Use of AI

Yes — Claude Code was used to investigate the issue, write the implementation and tests, and run the test suites. Every design decision (the placeholder names, gating the behaviour change behind experiments.futureDefaults instead of changing the default, and dropping an earlier build warning) was made and reviewed by me.


Generated by Claude Code


Note

Medium Risk
Changes where assets and HTML pages are written when futureDefaults is on or templates use the new placeholders; public URLs and sourceFilename metadata are intentionally split from emit paths.

Overview
Adds [containedpath] and [containedfile] template placeholders so emitted asset paths stay under output.path: absolute roots and leading ../ segments become _/, matching historical file-loader behavior.

With experiments.futureDefaults, asset and HTML filename templates (not generator.publicPath) see contained paths for [path] / [file] via toTemplateSourceFileName in AssetGenerator and HtmlModulesPlugin. assetInfo.sourceFilename still records the real context-relative path.

TemplatedPathPlugin centralizes toContainedPath using shared regexps from lib/util/identifier.js; AGENTS.md documents that path regexps must not be duplicated locally.

Reviewed by Cursor Bugbot for commit 0cc4ab4. Bugbot is set up for automated code reviews on this repo. Configure here.

@changeset-bot

changeset-bot Bot commented Aug 3, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 0cc4ab4

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
webpack Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

`[path]`/`[file]` of a module resolved outside of `context` (e.g. a
hoisted node_modules in a workspace) start with `..`, so the asset ends
up outside of `output.path`. The new placeholders replace an absolute
root or a leading `..` with `_`, as file-loader did.
Local copies of `ABSOLUTE_PATH_REGEXP`-style regexps drift apart, so the
guide now points at the one file that owns them and says to export from
there when something is missing.
`[path]`/`[file]` of an asset module outside of `context` behave like
`[containedpath]`/`[containedfile]` with `experiments.futureDefaults`,
so the webpack 6 default no longer emits above `output.path`. Only the
templates deciding where the asset is written are affected;
`generator.publicPath` is a url prefix and keeps the real path, as does
`assetInfo.sourceFilename`.
…ults

`HtmlModulesPlugin` builds its source filename the same way as
`AssetGenerator` and feeds it to `output.htmlFilename`, so a page
resolved outside of `context` escaped `output.path` too. Both now go
through a shared `toTemplateSourceFileName`.
@alexander-akait
alexander-akait force-pushed the feat/asset-contained-path branch from a764807 to 0cc4ab4 Compare August 3, 2026 13:47
@github-actions

github-actions Bot commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

This PR is packaged and the instant preview is available (318421e).

Install it locally:

  • npm
npm i -D webpack@https://pkg.pr.new/webpack@318421e
  • yarn
yarn add -D webpack@https://pkg.pr.new/webpack@318421e
  • pnpm
pnpm add -D webpack@https://pkg.pr.new/webpack@318421e

@github-actions

github-actions Bot commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Types Coverage

Coverage after merging feat/asset-contained-path into main will be
99.31%
Coverage Report<
FileStmtsBranchesFuncsLinesUncovered Lines
bin
   webpack.js98.82%100%100%98.82%103
examples
   build-common.js100%100%100%100%
   buildAll.js100%100%100%100%
   examples.js100%100%100%100%
   template-common.js98.21%100%100%98.21%72
examples/custom-javascript-parser
   test.filter.js100%100%100%100%
examples/custom-javascript-parser/internals
   acorn-parse.js100%100%100%100%
   meriyah-parse.js100%100%100%100%
   oxc-parse.js100%100%100%100%
examples/markdown
   webpack.config.mjs100%100%100%100%
examples/module-federation
   test.filter.js100%100%100%100%
examples/reexport-components
   test.filter.js100%100%100%100%
examples/typescript
   test.filter.js100%100%100%100%
examples/typescript-non-erasable
   test.filter.js50%100%100%50%5
examples/virtual-modules
   test.filter.js100%100%100%100%
examples/wasm-bindgen-esm
   test.filter.js100%100%100%100%
examples/wasm-complex
   test.filter.js100%100%100%100%
examples/wasm-emscripten
   test.filter.js100%100%100%100%
examples/wasm-simple
   test.filter.js100%100%100%100%
examples/wasm-simple-source-phase
   test.filter.js100%100%100%100%
lib
   APIPlugin.js100%100%100%100%
   AsyncDependenciesBlock.js100%100%100%100%
   AutomaticPrefetchPlugin.js100%100%100%100%
   BannerPlugin.js100%100%100%100%
   Cache.js98.21%100%100%98.21%101
   CacheFacade.js100%100%100%100%
   Chunk.js99.72%100%100%99.72%39
   ChunkGraph.js100%100%100%100%
   ChunkGroup.js100%100%100%100%
   ChunkTemplate.js100%100%100%100%
   CircularModulesPlugin.js98.81%100%100%98.81%136
   CleanPlugin.js99.13%100%100%99.13%214, 234
   CodeGenerationResults.js100%100%100%100%
   CompatibilityPlugin.js100%100%100%100%
   Compilation.js98.42%100%100%98.42%1648, 1967, 1974, 1982, 2004, 2007, 2946, 3425–3426, 3458, 4162, 4192, 4245–4246, 4250, 4255, 4271–4272, 4286–4287, 4292–4293, 4773, 4799, 527, 532, 5607, 5639, 5656, 5672, 5688, 5703, 5728–5729, 5731, 6061, 6066, 6072, 6075, 6082, 6094, 6096, 6100, 6116, 6131, 6163, 6217, 6241, 6356, 778–779
   Compiler.js99.56%100%100%99.56%1159–1160, 1168
   ConcatenationScope.js99.12%100%100%99.12%300
   ConditionalInitFragment.js100%100%100%100%
   ConstPlugin.js100%100%100%100%
   ContextExclusionPlugin.js100%100%100%100%
   ContextModule.js99.88%100%100%99.88%1461
   ContextModuleFactory.js97.20%100%100%97.20%266, 435, 456, 461, 501, 512, 514, 518, 527–528
   ContextReplacementPlugin.js100%100%100%100%
   DefinePlugin.js99.08%100%100%99.08%1080, 176–177, 193, 212, 286
   DependenciesBlock.js100%100%100%100%
   Dependency.js98.51%100%100%98.51%480, 527
   DependencyTemplate.js100%100%100%100%
   DependencyTemplates.js100%100%100%100%
   DotenvPlugin.js98.41%100%100%98.41%378, 391–392
   DynamicEntryPlugin.js100%100%100%100%
   EntryOptionPlugin.js100%100%100%100%
   EntryPlugin.js100%100%100%100%
   Entrypoint.js100%100%100%100%
   EnvironmentPlugin.js97.14%100%100%97.14%49
   ErrorHelpers.js100%100%100%100%
   EvalDevToolModulePlugin.js100%100%100%100%
   EvalSourceMapDevToolPlugin.js100%100%100%100%
   ExportsInfo.js100%100%100%100%
   ExportsInfoApiPlugin.js100%100%100%100%
   ExternalModule.js98.67%100%100%98.67%1216, 1219, 515–519, 521, 667
   ExternalModuleFactoryPlugin.js100%100%100%100%
   ExternalsPlugin.js100%100%100%100%
   FileSystemInfo.js99.16%100%100%99.16%1267, 1269–1274, 1281, 1284, 182, 2502–2503, 2506, 2517, 2528, 2539, 280, 3976, 3991, 4015
   FlagAllModulesAsUsedPlugin.js100%100%100%100%
   FlagDependencyExportsPlugin.js98.21%100%100%98.21%448, 457, 460, 464, 476
   FlagDependencyUsagePlugin.js100%100%100%100%
   FlagEntryExportAsUsedPlugin.js100%100%100%100%
   Generator.js100%100%100%100%
   HotModuleReplacementPlugin.js100%100%100%100%
   HotUpdateChunk.js100%100%100%100%
   IgnorePlugin.js100%100%100%100%
   IgnoreWarningsPlugin.js100%100%100%100%
   InitFragment.js100%100%100%100%
   JavascriptMetaInfoPlugin.js100%100%100%100%
   LazyBarrel.js100%100%100%100%
   LibraryTemplatePlugin.js100%100%100%100%
   LoaderOptionsPlugin.js100%100%100%100%
   LoaderTargetPlugin.js100%100%100%100%
   MainTemplate.js100%100%100%100%
   ManifestPlugin.js100%100%100%100%
   Module.js98.51%100%100%98.51%1303, 1308, 1368, 1382, 1444, 1453
   ModuleFactory.js100%100%100%100%
   ModuleFilenameHelpers.js98.90%100%100%98.90%111, 113
   ModuleGraph.js99.78%100%100%99.78%1170
   ModuleGraphConnection.js100%100%100%100%
   ModuleInfoHeaderPlugin.js100%100%100%100%
   ModuleNotFoundError.js100%100%100%100%
   ModuleProfile.js100%100%100%100%
   ModuleSourceTypeConstants.js100%100%100%100%
   ModuleTemplate.js100%100%100%100%
   ModuleTypeConstants.js100%100%100%100%
   MultiCompiler.js99.71%100%100%99.71%687
   MultiStats.js100%100%100%100%
   MultiWatching.js100%100%100%100%
   NoEmitOnErrorsPlugin.js100%100%100%100%
   NodeStuffPlugin.js100%100%100%100%
   NormalModule.js97.98%100%100%97.98%1020, 1023, 1040, 1057, 1305, 1339, 1355, 1803, 2100, 2105–2115, 34
   NormalModuleFactory.js98.72%100%100%98.72%1123, 1391, 1402, 1412, 1463–1465, 1472, 526, 538
   NormalModuleReplacementPlugin.js100%100%100%100%
   NullFactory.js100%100%100%100%
   OptimizationStages.js100%100%100%100%
   OptionsApply.js100%100%100%100%
   Parser.js100%100%100%100%
   PlatformPlugin.js100%100%100%100%
   PrefetchPlugin.js100%100%100%100%
   ProgressPlugin.js99.80%100%100%99.80%691
   ProvidePlugin.js100%100%100%100%
   RawModule.js100%100%100%100%
   RecordIdsPlugin.js100%100%100%100%
   RequestShortener.js100%100%100%100%
   ResolverFactory.js100%100%100%100%
   RuntimeGlobals.js100%100%100%100%
   RuntimeModule.js100%100%100%100%
   RuntimePlugin.js100%100%100%100%
   RuntimeTemplate.js100%100%100%100%
   SelfModuleFactory.js100%100%100%100%
   SingleEntryPlugin.js100%100%100%100%
   SourceMapDevToolModuleOptionsPlugin.js100%100%100%100%
   SourceMapDevToolPlugin.js98.63%100%100%98.63%220, 224, 226, 420, 431, 890
   Stats.js100%100%100%100%
   Template.js100%100%100%100%
   TemplatedPathPlugin.js99.47%100%100%99.47%352–353
   UseStrictPlugin.js100%100%100%100%
   WarnCaseSensitiveModulesPlugin.js100%100%100%100%
   WarnDeprecatedOptionPlugin.js100%100%100%100%
   WarnNoModeSetPlugin.js100%100%100%100%
   WatchIgnorePlugin.js100%100%100%100%
   Watching.js100%100%100%100%
   WebpackError.js100%100%100%100%
   WebpackIsIncludedPlugin.js100%100%100%100%
   WebpackOptionsApply.js100%100%100%100%
   WebpackOptionsDefaulter.js100%100%100%100%
   buildChunkGraph.js99.87%100%100%99.87%371
   cli.js98.63%100%100%98.63%10, 119, 549, 581, 631, 905
   index.js99.73%100%100%99.73%184
   validateSchema.js94.67%100%100%94.67%100, 87, 89, 98
   webpack.js97.10%100%100%97.10%10, 263, 285, 287
lib/asset
   AssetBytesGenerator.js100%100%100%100%
   AssetBytesParser.js100%100%100%100%
   AssetGenerator.js100%100%100%100%
   AssetModule.js100%100%100%100%
   AssetModulesPlugin.js97.95%100%100%97.95%295, 319, 322, 42, 452, 47
   AssetParser.js100%100%100%100%
   AssetSourceGenerator.js100%100%100%100%
   AssetSourceParser.js100%100%100%100%
   RawDataUrlModule.js100%100%100%100%
   WebManifestGenerator.js100%100%100%100%
   WebManifestParser.js100%100%100%100%
lib/async-modules
   AsyncModuleHelpers.js100%100%100%100%
   AwaitDependenciesInitFragment.js100%100%100%100%
   InferAsyncModulesPlugin.js100%100%100%100%
   isGeneratorLowered.js100%100%100%100%
lib/bun
   BunTargetPlugin.js100%100%100%100%
lib/cache
   AddBuildDependenciesPlugin.js100%100%100%100%
   AddManagedPathsPlugin.js100%100%100%100%
   IdleFileCachePlugin.js97.92%100%100%97.92%75, 87, 95
   MemoryCachePlugin.js95.83%100%100%95.83%33
   MemoryWithGcCachePlugin.js93.15%100%100%93.15%107, 114–115, 123, 90
   PackFileCacheStrategy.js96.52%100%100%96.52%1310, 1410, 1414, 1476, 1712, 1796, 1819, 1851, 675, 694, 704–706, 708, 724–725, 730, 733, 735, 740, 745, 770, 776, 810, 816, 822, 827, 838, 847, 852–853, 855, 872, 878–879, 881
   ResolverCachePlugin.js100%100%100%100%
   getLazyHashedEtag.js100%100%100%

@codecov

codecov Bot commented Aug 3, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 94.08%. Comparing base (f2462c2) to head (0cc4ab4).

Additional details and impacted files
@@            Coverage Diff             @@
##             main   #21592      +/-   ##
==========================================
- Coverage   94.09%   94.08%   -0.01%     
==========================================
  Files         627      627              
  Lines       77209    77238      +29     
  Branches    22656    22667      +11     
==========================================
+ Hits        72646    72672      +26     
- Misses       4563     4566       +3     
Flag Coverage Δ
css-parsing 24.93% <46.66%> (+<0.01%) ⬆️
html5lib 26.26% <46.66%> (+<0.01%) ⬆️
integration 89.67% <91.42%> (-0.01%) ⬇️
test262 42.97% <30.00%> (-0.01%) ⬇️
unit 48.81% <83.33%> (+0.01%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@codspeed-hq

codspeed-hq Bot commented Aug 3, 2026

Copy link
Copy Markdown

Merging this PR will not alter performance

✅ 220 untouched benchmarks


Comparing feat/asset-contained-path (0cc4ab4) with main (f2462c2)

Open in CodSpeed

@alexander-akait
alexander-akait merged commit 318421e into main Aug 3, 2026
62 of 63 checks passed
@alexander-akait
alexander-akait deleted the feat/asset-contained-path branch August 3, 2026 17:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

asset/resource builds outside of dist when [pathname] contains references to hoisted node_modules

1 participant

Sponsor
SponsoredKunjungi sekarang
Promo