extract-text-webpack-plugin 删除所有 .js 代码

Question

TL;DR：当生成两个 .js 和一个 .css 块时，插件会从其中一个 .js 块中删除所有 .js 代码。

即使我只使用 webpack 文档中的示例，这也是可重复的行为。

我可能遗漏了一些东西，但我找不到它是什么:)

配置如下：

var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var glob = require("glob");

module.exports = {
    entry: {
        app: [
            './.build/app/app_dependencys.js',
            './.build/app/_helpers/api_helpers.js',
            './.build/app/event-manager.js',
            './.build/app/route_handlers/Router.js'
        ],
        lib: [
            'c3',
            'lodash',
            'moment',
            'moment-timezone',
            'pleasejs',
            'react-bootstrap-datetimepicker',
            'react',
            'react-bootstrap',
            'react-d3-components',
            'react-datepicker-component',
            'react-googlemaps',
            'react-router',
            'react-slider',
            'reactable',
            'select2'
        ],
        css: glob.sync('./css/css/*.styl')
    },
    output: {
        path: path.join(__dirname, 'js/dist'),
        filename: "app.js",
        chunkFilename: "[name].js"
    },
    module: {
        loaders: [
            {test: /\.jsx?$/, loader: 'babel?compact=false', ignore: /node_modules/},
            {test: /\.json$/, loader: "json"},
            {
                test: /\.styl$/,
                loader: ExtractTextPlugin.extract('raw', 'raw!stylus')
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('id', "./../../css/compiled/css.css", {allChunks: false}),
        new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"lib", /* filename= */"lib.js", Infinity)
    ],
    externals: ['jquery'],
    bail: true
};

运行webpack时，输出如下：

Time: 51884ms
                       Asset     Size  Chunks             Chunk Names
                      app.js   3.8 kB    0, 1  [emitted]  app, css
                      lib.js  3.47 MB       2  [emitted]  lib
./../../css/compiled/css.css   131 kB       1  [emitted]  css
   [0] multi app 64 bytes {0} [built]
   [0] multi css 364 bytes {1} [built]
   [0] multi lib 196 bytes {2} [built]
    + 634 hidden modules
Child extract-text-webpack-plugin:
        + 1 hidden modules
Child extract-text-webpack-plugin:
        + 1 hidden modules
Child extract-text-webpack-plugin:
        + 1 hidden modules

.... it goes on for a while ...

结果：

• css.css 包含所有 css，根据需要
• lib.js 包含所有 lib 代码，根据需要

• app.js: app.js 中的每个条目都替换为

  /***/ 581:
  /***/ function(module, exports) {
  
      // removed by extract-text-webpack-plugin
  
  /***/ },
  
  /***/ 582:
  /***/ function(module, exports) {
  
          // removed by extract-text-webpack-plugin
  
  /***/ },
  ...
  

也向插件作者报告：https://github.com/webpack/extract-text-webpack-plugin/issues/118

Answer 1

在这里回答： https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/118

好的，对我有用的是：good: entry: { js: './js/app.js', css: './scss/main.scss' }，错误：条目：{ js：'./js/app.js'，scss： './scss/main.scss' } 唯一的区别 - css 键而不是 scss。 还有条目：['./js/main.js', './scss/main.scss']，也可以。