Error: chunk.sortModules is not a function webpack 3.3.0

[tuananhzippy]

Unhandled rejection TypeError: chunk.sortModules is not a function
    at C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\extract-text-webpack-plugin\dist\index.js:188:19
    at C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\async\dist\async.js:3083:16
    at eachOfArrayLike (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\async\dist\async.js:1003:9)
    at eachOf (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\async\dist\async.js:1051:5)
    at Object.eachLimit (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\async\dist\async.js:3145:5)
    at Compilation.<anonymous> (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\extract-text-webpack-plugin\dist\index.js:184:27)
    at Compilation.applyPluginsAsyncSeries (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\webpack\node_modules\tapable\lib\Tapable.js:142:13)
    at Compilation.seal (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\webpack\lib\Compilation.js:580:8)
    at C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\webpack\lib\Compiler.js:510:16
    at C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\webpack\node_modules\tapable\lib\Tapable.js:225:11
    at C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\html-webpack-plugin\index.js:60:9
    at tryCatcher (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\util.js:16:23)
    at Promise._settlePromiseFromHandler (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\promise.js:512:31)
    at Promise._settlePromise (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\promise.js:569:18)
    at Promise._settlePromise0 (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\promise.js:614:10)
    at Promise._settlePromises (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\promise.js:693:18)
    at Async._drainQueue (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\async.js:133:16)
    at Async._drainQueues (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\async.js:143:10)
    at Immediate.Async.drainQueues (C:\Users\Tuan Anh Zippy\Desktop\webpack\extract-text-webpack-plugin\node_modules\bluebird\js\release\async.js:17:14)
    at runCallback (timers.js:800:20)
    at tryOnImmediate (timers.js:762:5)
    at processImmediate [as _immediateCallback] (timers.js:733:5)

[michael-ciniawsky]

Include your webpack.config.js && package.json aswell please :)

[tuananhzippy]

webpack.config.js

var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextWebpackPlugin = require('extract-text-webpack-plugin');

module.exports = {
  entry: './app.js',
  output: {
    path: __dirname + '/dist',
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        test: '/\.css$/',
        use: ExtractTextWebpackPlugin.extract({
          fallback: "style-loader",
          use: "css-loader"
        })
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      title: 'Extract Text Webpack Plugin',
      filename: 'auto-generator.html',
      template: './index.html',
      minify: false
    }),
    new ExtractTextWebpackPlugin({
      filename: 'bundle.css',
      disable: false,
      allChunks: true
    })
  ],
  watch: true
}

[michael-ciniawsky]

- test: '/\.css$/',
+ test: /\.css$/, // => no '' around Regex

If it doesn't work, could you try without watch && with { filename: '[name].bundle.css' }, the config looks ok so far, maybe a file where you import css from './file.css' could help

[tuananhzippy]

Thanks you, i tried but not yet.

[jmahc]

Shoot, mane.

I am catching the same issue! (using webpack@3.4.0).

Here is the sample repo: https://github.com/jmahc/that-react-app-you-want

Just run yarn then yarn run build which will throw the error!

ERROR in chunk manifest [entry]
[name].[chunkhash].js
Chunk.entry was removed. Use hasRuntime()
Error: Chunk.entry was removed. Use hasRuntime()

Headed to dinner, but hopefully this package.json link will suffice, as well as my production build for webpack.

---

Solution found!

Referencing this post, I put two-and-two together and replaced the following code block in my Webpack's production configuration...

...
plugins: [
     new ChunkManifestPlugin({
        filename: 'chunk-manifest.json',
        inlineManifest: true,
        manifestVariable: 'webpackManifest'
      })
]
...

Now that that dude is gone, I installed this package. And boy, oh boy, to my surprise..

I replaced that chunka-chunkaplugin block with this block cuz why not?

     new InlineManifestWebpackPlugin({
        name: 'webpackManifest'
      })

I didn't even save the file, I just walked to the fridge and grabbed an ice-cold Modello Negra, poured it into a chilled glass, and dropped a lime in it. I lost track of time for several days but then I had a eureka moment and ran this command...

yarn run build (after installing that package, dawg).

YOU WON'T BELIEVE WHAT HAPPENS NEXT

No more error.

Let me know if this helps anyone other than myself. And if it doesn't? Well, grab a cold one.

---

Edit from the next day!

Thanks to my good buddy, @michael-harvey, he pointed out that a simple update from webpack@3.4.0 -> webpack@3.4.1 will allow you to use the ChunkManifestPlugin again.

So you can take my best friend @michael-harvey 's advice posted below and upgrade, or you can do what's above.

Whatever you choose, just make sure you have a good time doing it.

---

P.S. I don't know who @michael-harvey is but he is a great friend.

[nchan0154]

@jmahc Thanks so much for that fix, it saved me and my team a whole evening of headaches!

[jmahc]

@nchan0154 No problem!

[nkbt]

We don't use manifest, and regexes are fine, but still have the same issue.

[michael-harvey]

Updating webpack to 3.4.1 solved this for me.

[jmahc]

@michael-harvey Can confirm that your update suggestion works, as well!

---

@nkbt - Care to elaborate with your issue?

[joshwiens]

@nkbt - If you still have issues on webpack@3.4.1 ping me so i can get this on the High Priority board.

[nkbt]

I will check webpack@3.4.1, hopefully it is gone.

PS: my comment was mostly just a quick note so issue is not closed yet since we have some different case that failed.

[nkbt]

Works fine for us with webpack@3.4.1 now, thanks!