Webpack 2 extract text plugin entrypoints.length issues

Question

I have an issue with upgrading to webpack 2 and the extract text plugin. I have the dev version (without this plugin) working and I cant see whats different. The error I get is

node_modules\webpack\lib\Chunk.js:62
            return this.entrypoints.length > 0;

TypeError: Cannot read property 'length' of undefined

I have gulp running webpack 2 and this plugin for a single css file. This is the main part of my webpack config (happy to provide it all if needed):

     ...
     modules: { rules :[ ... {
         test: /\.scss/,
         exclude: /node_modules/,
         use: [
             "style-loader?sourceMap",
             {
                 loader: "css-loader",
                 options: {
                     minimize: true,
                     modules: true,
                     importLoaders: true,
                     localIdentName: "[path]___[name]__[local]___[hash:base64:5]",
                 },
             },
             {
                 loader: "postcss-loader",
                 options: { ...postCSSConfig },
             },
             {
                 loader: "sass-loader",
                 options: { includePaths: [path.join(process.cwd(), "src", "Styles", "Includes")] },
             },
         ],
     }, ]},
     plugins: [
         new ExtractTextPlugin({
             filename: "[contenthash].css",
             allChunks: true,
         }), ...

Im using the following versions:

Webpack: 2.3.3

Extract text plugn: 2.0.1

Edit: Here is my entry point,

context: path.resolve(process.cwd(), "./src/"),
entry: [
    "babel-polyfill",
    "whatwg-fetch",
    "Boot",
],
devtool: "eval",
resolve: {
    modules: ["src", "node_modules"],
    extensions: [".js", ".jsx"],
},

Any ideas would be great. Thanks in advance.

Where are you defining the entry points into your application? — Alex McMillan, Apr 11 '17 at 23:04
I think this error says you that you have no any entry script for webpack — Aren Hovsepyan, Apr 11 '17 at 23:07
I have edited my question. I'm using babel to load everything into modules. — Kurtis, Apr 12 '17 at 07:51
Right now it seems that The HtmlWebpackPlugin and/or the extractTextPlugin do not support webpack 2. Does anyone have any examples of a webpack 2 plugin which extracts html from a template, a js bundle and a css bundle? — Kurtis, Apr 12 '17 at 14:17

score 0 · Accepted Answer · answered Apr 12 '17 at 14:56

0

According to docs, you also have to create proper rule for loading styles.

Please take a look at that, it's my rule. Please let me know if it helped you.

 {
      test: /\.(scss|css)$/,
      exclude: /node_modules/
      use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: ['css-loader', 'postcss-loader', 'sass-loader']
      })
 }

Anyway, yet I didn't manage to use ExtractTextPlugin with sourceMaps, so I can't give you solution to use this plugin with source maps.

answered Apr 12 '17 at 14:56

Jarosław Wlazło

370
1
3
14

Did you ever manage to add the ExtractTextPlugin? I was thinking of trying again now its been a few months. Thanks – Kurtis Jun 05 '17 at 16:11
Yes, I'm using this plugin, but no on development, because of troubles with sourceMaps – Jarosław Wlazło Sep 13 '17 at 08:10
I eventually got this working using ExtractTextPlugin in the rules like you did above. I then disabled the plugin for development in the plugins collection. This worked with HMR and for the build on CI. Thanks for your help. – Kurtis Jan 22 '18 at 18:18

Webpack 2 extract text plugin entrypoints.length issues

1 Answers1