Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Webpack 5 Beta 2: Plugin fails on recompilation because it uses deprecated api #462

Closed
IdeaHunter opened this issue Nov 7, 2019 · 3 comments · Fixed by webpack/webpack#10127

Comments

@IdeaHunter
Copy link

  • Operating System: Window 10
  • Node Version: 12.9.1
  • NPM Version: 6.10.2
  • webpack Version: 5.0.0-beta.2
  • mini-css-extract-plugin Version: 0.8.0

Expected Behavior

Plugin should not use deprecated api

Actual Behavior

c:\Frontend\node_modules\webpack\lib\ChunkGraph.js:1156
                                        throw new Error(
                                        ^

Error: Chunk.modulesIterableThere was no ChunkGraph assigned to the Chunk for backward-compat (Use the new API)
    at c:\Frontend\node_modules\webpack\lib\ChunkGraph.js:1156:12
    at deprecated (internal/util.js:67:15)
    at Function.getChunkGraphForChunk (c:\Frontend\node_modules\webpack\lib\ChunkGraph.js:1147:18)
    at HotUpdateChunk.get modulesIterable [as modulesIterable] (c:\Frontend\node_modules\webpack\lib\Chunk.js:163:33)
    at c:\Frontend\node_modules\mini-css-extract-plugin\dist\index.js:198:50
    at c:\Frontend\node_modules\webpack\lib\ChunkTemplate.js:33:16
    at Hook.eval (eval at create (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:12:16)
    at Compilation.getRenderManifest (c:\Frontend\node_modules\webpack\lib\Compilation.js:2213:36)
    at c:\Frontend\node_modules\webpack\lib\HotModuleReplacementPlugin.js:339:45
    at Hook.eval (eval at create (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:9:1)
    at Hook.CALL_DELEGATE [as _call] (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:14:14)
    at cont (c:\Frontend\node_modules\webpack\lib\Compilation.js:1508:38)
    at c:\Frontend\node_modules\webpack\lib\Compilation.js:1555:6
    at c:\Frontend\node_modules\neo-async\async.js:2830:7
    at Object.each (c:\Frontend\node_modules\neo-async\async.js:2850:39)
    at Compilation.createChunkAssets (c:\Frontend\node_modules\webpack\lib\Compilation.js:2226:12)
    at c:\Frontend\node_modules\webpack\lib\Compilation.js:1551:10
    at Hook.eval [as callAsync] (eval at create (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:18:14)
    at Compilation.seal (c:\Frontend\node_modules\webpack\lib\Compilation.js:1445:27)
    at c:\Frontend\node_modules\webpack\lib\Compiler.js:770:19
    at c:\Frontend\node_modules\webpack\lib\Compilation.js:1369:4
    at eval (eval at create (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:20:1)
    at c:\Frontend\node_modules\neo-async\async.js:2830:7
    at Object.each (c:\Frontend\node_modules\neo-async\async.js:2850:39)
    at c:\Frontend\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:209:18
    at c:\Frontend\node_modules\neo-async\async.js:2830:7
    at Object.each (c:\Frontend\node_modules\neo-async\async.js:2850:39)
    at c:\Frontend\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:40:16
    at Hook.eval [as callAsync] (eval at create (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:16:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (c:\Frontend\node_modules\webpack\node_modules\tapable\lib\Hook.js:18:14)
    at Compilation.finish (c:\Frontend\node_modules\webpack\lib\Compilation.js:1338:28)
    at c:\Frontend\node_modules\webpack\lib\Compiler.js:765:18
    at processTicksAndRejections (internal/process/task_queues.js:75:11)
error Command failed with exit code 1.

Code

new MiniCssExtractPlugin({
    filename: 'frame.css'
}),

How Do We Reproduce?

Add plugin to webpack 5 config without loader (loader is not enabled on developer mode) and start webpack in watch mode. First compilation would be successful but if you do any changes to js (without even touching css) recompilation fails and webpack dies 💀 ✝️

Related tickets:
#330

@alexander-akait
Copy link
Member

WIP

@sokra
Copy link
Member

sokra commented Nov 7, 2019

Seem like HotUpdateChunks don't have a fallback ChunkGraph assigned. Should be a one line fix.

After this line

https://github.com/webpack/webpack/blob/06953237ab3781a576c35bf9a4e76284e4b20b1e/lib/HotModuleReplacementPlugin.js#L331

set the ChunkGraph like this:

ChunkGraph.setChunkGraphForChunk(hotUpdateChunk, chunkGraph);

(i. e. like here https://github.com/webpack/webpack/blob/06953237ab3781a576c35bf9a4e76284e4b20b1e/lib/Compilation.js#L1867)

and send a PR if this works

@IdeaHunter
Copy link
Author

@sokra the problem is gone, but it seems like a there is some issues with HMR compatability(warnings). Im going to create an issue at webpack repo but a little bit later.
Thanks a lot for a help

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 a pull request may close this issue.

3 participants