Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Webpack 5 "BREAKING CHANGE" warning #1501

Closed
GaryB432 opened this issue Aug 28, 2020 · 22 comments
Closed

Webpack 5 "BREAKING CHANGE" warning #1501

GaryB432 opened this issue Aug 28, 2020 · 22 comments

Comments

@GaryB432
Copy link
Contributor

Expected behaviour

The excellent plugin should work with webpack 5 without deprecation notices

Current behaviour

94% sealing after seal(node:15584) [DEP_WEBPACK_MAIN_TEMPLATE_GET_ASSET_PATH] DeprecationWarning: MainTemplate.getAssetPath is deprecated (use Compilation.getAssetPath instead)
    at D:\fun-project\node_modules\html-webpack-plugin\lib\child-compiler.js:163:41
    at Array.map (<anonymous>)
    at extractHelperFilesFromCompilation (D:\fun-project\node_modules\html-webpack-plugin\lib\child-compiler.js:162:45)
    at D:\fun-project\node_modules\html-webpack-plugin\lib\child-compiler.js:113:13
    at D:\fun-project\node_modules\webpack\lib\Compiler.js:486:11
    at D:\fun-project\node_modules\webpack\lib\Compiler.js:981:17
    at eval (eval at create (D:\fun-project\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
95% emitting emit HtmlWebpackPlugin(node:15584) [DEP_WEBPACK_MAIN_TEMPLATE_GET_PUBLIC_PATH] DeprecationWarning: MainTemplate.getPublicPath is deprecated (use Compilation.getAssetPath(compilation.outputOptions.publicPath, options) instead)
    at HtmlWebpackPlugin.htmlWebpackPluginAssets (D:\fun-project\node_modules\html-webpack-plugin\index.js:532:56)
    at D:\fun-project\node_modules\html-webpack-plugin\index.js:164:29
    at Hook.eval [as callAsync] (eval at create (D:\fun-project\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:10:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (D:\fun-project\node_modules\webpack\node_modules\tapable\lib\Hook.js:18:14)
    at Compiler.emitAssets (D:\fun-project\node_modules\webpack\lib\Compiler.js:729:19)
    at D:\fun-project\node_modules\webpack\lib\Compiler.js:392:10
    at processTicksAndRejections (internal/process/task_queues.js:79:11)
95% emitting emit(node:15584) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
        Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
        Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
    at D:\fun-project\node_modules\html-webpack-plugin\index.js:273:49
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

Seems like the first 2 warnings are covered by #1408

Environment

Node.js v12.18.2
win32 10.0.18362
npm 6.14.5
webpack@5.0.0-beta.28
html-webpack-plugin@4.3.0

Config

module.exports = {
  context: path.resolve(__dirname, 'src'),
  mode: 'development',
  entry: '/scripts/app.js',
  output: {
    path:  __dirname + '/dist',
    filename: 'index_bundle.js'
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: 'public/index.html',
    }),
  ]
}

Template

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>fun app</title>
  </head>
  <body>
    <p>does it matter?</p>
  </body>
</html>
@jantimon
Copy link
Owner

Can you please check if 4.4.0 works for you?

@AviVahl
Copy link
Contributor

AviVahl commented Aug 30, 2020

@jantimon I've tested 4.4.1 (with webpack@5.0.0-beta.29 and webpack-cli@4.0.0-beta.8), and most deprecation warnings are gone. There's one left:

node:22153) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
        Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
        Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
    at /home/avi/projects/sample-monorepo/node_modules/html-webpack-plugin/index.js:279:49
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

I ran webpack-cli directly with --trace-deprecation, so you can see it's being logged at line 278:

compilation.assets[finalOutputName] = {
              source: () => html,
              size: () => html.length
            };

@jantimon
Copy link
Owner

Changing the hook would be a breaking change I guess - I'll ask the webpack core team on guidance which stage to use:

https://webpack.js.org/api/compilation-hooks/#processassets

I am not sure if this might cause issues with chunk hashes (as they are not known at this time)

@nickbouton
Copy link

@jantimon FYI, having the same issue exactly with 4.4.1 + webpack@5.0.0-beta.29.

@rockwalrus
Copy link

Here's some guidance that looks applicable: webpack/webpack#11425

@tianyingchun
Copy link

what's progress of this issue?

@tianyingchun
Copy link

having the same issue exactly with 4.4.1 + webpack@v5.0.0-beta.30

@jungleBadger
Copy link

Same issue with v4.4.1 and webpack@v5.0.0-beta.30

@zanfirandra
Copy link

In the meantime, for me using v.4.4.1 and webpack v5.0.0-beta.24 is the right combo. yes build is compiling with warnings but it doesn't get stuck at BREAKING CHANGE warning

@tianyingchun
Copy link

what progress about the compatibility of webpack@5, webpack@5 have been released 2020-10-10
There are lots of plugins based on html-webpack-plugin. 👍

@0rvar
Copy link

0rvar commented Oct 13, 2020

webpack 5.0.0, html-webpack-plugin 4.5.0:

(node:48813) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
	Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
	Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
    at .yarn/$$virtual/html-webpack-plugin-virtual-facb2006ea/0/cache/html-webpack-plugin-npm-4.5.0-a74a71941d-df4dd38bd8.zip/node_modules/html-webpack-plugin/index.js:280:49
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
507 assets
3672 modules

@jantimon
Copy link
Owner

Can you please see if this is fixed with html-webpack-plugin@5.0.0-alpha.2 ?
Please see also #1527

@mrolla
Copy link

mrolla commented Oct 16, 2020

I'm still seeing it after updating to 5.0.0-alpha.2

(node:4366) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
        Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
        Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
    at Compilation.emitAsset (/node_modules/webpack/lib/Compilation.js:2818:21)
    at /node_modules/html-webpack-plugin/index.js:328:23
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

@tianyingchun
Copy link

yeah, it still has this issue event if update to 5.0.0-alpha.2

@jantimon
Copy link
Owner

Sorry I missed some parts in the last release can you please try once again with html-webpack-plugin@5.0.0-alpha.3

@dan2k3k4
Copy link

Looks like that fixes it @jantimon 👍

Previously:

› cat package.json|grep html-webpack
    "html-webpack-plugin": "^4.5.0",
› node --trace-deprecation node_modules/webpack/bin/webpack.js

(node:62474) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
        Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
        Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
    at /Users/dan/coding/test-project/node_modules/html-webpack-plugin/index.js:280:49
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
assets by path ../ 28.4 KiB
  assets by path ../admin/ 3.63 KiB
    assets by path ../admin/preview-templates/*.js 883 bytes 2 assets
    2 assets
  assets by path ../*.png 9.67 KiB 3 assets
  asset ../favicon.ico 15 KiB [compared for emit] [copied]
  asset ../../src/_includes/layouts/webpack.njk 61 bytes [compared for emit]
assets by path images/*.png 223 KiB
  asset images/eleventy-js-starter-boilerplate.png 218 KiB [compared for emit] [copied]
  asset images/logo.png 3.28 KiB [compared for emit] [copied]
  asset images/logo-32x32.png 1.98 KiB [compared for emit] [copied]
assets by chunk 2.3 MiB (name: main)
  asset styles/main.css 2.29 MiB [compared for emit] (name: main)
  asset main.js 2.93 KiB [emitted] (name: main)
Entrypoint main 2.3 MiB = styles/main.css 2.29 MiB main.js 2.93 KiB
runtime modules 274 bytes 1 module
./src/assets/styles/main.css 50 bytes [built] [code generated]
css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./src/assets/styles/main.css 2.29 MiB [code generated]
webpack 5.1.1 compiled successfully in 2362 ms

Then updated with yarn add --dev html-webpack-plugin@5.0.0-alpha.3

› cat package.json|grep html-webpack                          
    "html-webpack-plugin": "5.0.0-alpha.3",

Result now:

› node --trace-deprecation node_modules/webpack/bin/webpack.js

assets by path ../ 28.4 KiB
  assets by path ../admin/ 3.63 KiB
    assets by path ../admin/preview-templates/*.js 883 bytes 2 assets
    2 assets
  assets by path ../*.png 9.67 KiB 3 assets
  asset ../favicon.ico 15 KiB [compared for emit] [copied]
  asset ../../src/_includes/layouts/webpack.njk 61 bytes [compared for emit]
assets by path images/*.png 223 KiB
  asset images/eleventy-js-starter-boilerplate.png 218 KiB [compared for emit] [copied]
  asset images/logo.png 3.28 KiB [compared for emit] [copied]
  asset images/logo-32x32.png 1.98 KiB [compared for emit] [copied]
assets by chunk 2.3 MiB (name: main)
  asset styles/main.css 2.29 MiB [compared for emit] (name: main)
  asset main.js 2.93 KiB [compared for emit] (name: main)
Entrypoint main 2.3 MiB = styles/main.css 2.29 MiB main.js 2.93 KiB
runtime modules 274 bytes 1 module
./src/assets/styles/main.css 50 bytes [built] [code generated]
css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./src/assets/styles/main.css 2.29 MiB [code generated]
webpack 5.1.1 compiled successfully in 2653 ms

@jantimon
Copy link
Owner

Thanks for testing 👍

@532604872
Copy link

532604872 commented Oct 30, 2020

I also have the same problem, provide reference.

Environment:package.json file
"webpack": "^5.3.0",
"html-webpack-plugin": "^5.4.0",

`

3% setup watch run HappyPluginHappy[babel]: Version: 5.0.1. Threads: 8 (shared pool)
Happy[babel]: All set; signaling webpack to proceed.
95% emitting emit(node:31112) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
Do changes to assets earlier, e. g. in Compilation.hooks.processAssets.
Make sure to select an appropriate stage from Compilation.PROCESS_ASSETS_STAGE_*.
Build completed in 9.83s
`

Then updated with "npm i -D html-webpack-plugin@5.0.0-alpha.3"

Result now:
`

3% setup watch run HappyPluginHappy[babel]: Version: 5.0.1. Threads: 8 (shared pool)
Happy[babel]: All set; signaling webpack to proceed.
Build completed in 8.649s
`

Doubt:
The problem is resolved, but the HTML-Webpack-plugin: ^5.4.0 will the same be true for the version after .

@jantimon
Copy link
Owner

There is no version 5.4.0 by now.. But you are right we won't fix it for the 4.x branch

@rnnyrk
Copy link

rnnyrk commented Dec 15, 2020

Any updates on this fix/release going stable?

@jantimon
Copy link
Owner

jantimon commented Dec 15, 2020

@rnnyrk the tests are green again and there is only one last topic in #1527 to be solved - after that I expect no further breaking changes and would release a beta version..

if there won't be any bugs reported with that release I'll release it as a stable version

I hope that's fine

ybbarng added a commit to ybbarng/set that referenced this issue Dec 17, 2020
한가지 이슈가 남음

(node:17981) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning:
Compilation.assets will be frozen in future, all modifications are
deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets
after sealing the Compilation.
    Do changes to assets earlier, e. g. in
    Compilation.hooks.processAssets.
    Make sure to select an appropriate stage from
    Compilation.PROCESS_ASSETS_STAGE_*.

jantimon/html-webpack-plugin#1501
ybbarng added a commit to ybbarng/set that referenced this issue Dec 17, 2020
한가지 이슈가 남음

(node:17981) [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning:
Compilation.assets will be frozen in future, all modifications are
deprecated.
BREAKING CHANGE: No more changes should happen to Compilation.assets
after sealing the Compilation.
    Do changes to assets earlier, e. g. in
    Compilation.hooks.processAssets.
    Make sure to select an appropriate stage from
    Compilation.PROCESS_ASSETS_STAGE_*.

jantimon/html-webpack-plugin#1501
KKoukiou added a commit to KKoukiou/cockpit that referenced this issue Jun 15, 2021
* Minifier WA can be now dropped since the pulled cssnano version
includes the fix
* Adjust to new copy-webpack-plugin API.
* Adjust included node modules plugin needs to webpack 5 API
* Update html-webpack-plugin to remove deprecation warnings
  Previously we would get:
  BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
  See jantimon/html-webpack-plugin#1501
* Use lite cssnano preset because the default version makes problematic
  assumptions

Note: webpack's compilation.fileDependencies has changed and the
webpack-make needs to be adjusted accordingly:
webpack/webpack#11971
KKoukiou added a commit to cockpit-project/cockpit that referenced this issue Jun 15, 2021
* Minifier WA can be now dropped since the pulled cssnano version
includes the fix
* Adjust to new copy-webpack-plugin API.
* Adjust included node modules plugin needs to webpack 5 API
* Update html-webpack-plugin to remove deprecation warnings
  Previously we would get:
  BREAKING CHANGE: No more changes should happen to Compilation.assets after sealing the Compilation.
  See jantimon/html-webpack-plugin#1501
* Use lite cssnano preset because the default version makes problematic
  assumptions

Note: webpack's compilation.fileDependencies has changed and the
webpack-make needs to be adjusted accordingly:
webpack/webpack#11971
@eranimo
Copy link

eranimo commented Jun 14, 2022

This is still happening with webpack 5.73.0 and html-webpack-plugin 5.5.0

Repository owner locked as resolved and limited conversation to collaborators Jun 16, 2022
# for free to subscribe to this conversation on GitHub. Already have an account? #.
Labels
None yet
Projects
None yet
Development

No branches or pull requests