[英]extract-text-webpack-plugin removes all .js code
TL;DR: when generating two .js and one .css chunks the plugin removes all .js code from one of the .js chunks. TL; DR:当生成两个.js和一个.css块时,插件会从其中一个.js块中删除所有.js代码。
This is repeatable behaviour even if I only use the examples from the webpack docs. 即使我只使用webpack文档中的示例,这也是可重复的行为。
I may be missing something, but I can't find what it is :) 我可能会遗漏一些东西,但我找不到它是什么:)
The config is as follows: 配置如下:
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
};
When running webpack
, this is the output: 运行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 ...
As a result: 结果是:
css.css
contains all css, as required css.css
根据需要包含所有css lib.js
contains all lib code, as required lib.js
根据需要包含所有lib代码 app.js
: every single entry in app.js is replaced with app.js
: app.js
每个条目都被替换为
/***/ 581: /***/ function(module, exports) { // removed by extract-text-webpack-plugin /***/ }, /***/ 582: /***/ function(module, exports) { // removed by extract-text-webpack-plugin /***/ }, ...
Reported to the plugin authors as well: https://github.com/webpack/extract-text-webpack-plugin/issues/118 也向插件作者报告: https : //github.com/webpack/extract-text-webpack-plugin/issues/118
answer here: https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/118 在这里回答: https : //github.com/webpack-contrib/extract-text-webpack-plugin/issues/118
Okay, what worked for me is: good: entry: { js: './js/app.js', css: './scss/main.scss' }, bad: entry: { js: './js/app.js', scss: './scss/main.scss' } the only difference - css key instead of scss. 好吧,对我有用的是:good:entry:{js:'。/ js / app.js',css:'。/ scss / main.scss'},bad:entry:{js:'。/ js / app.js',scss:'。/ scss / main.scss'}唯一的区别 - css键而不是scss。 And also entry: [ './js/main.js', './scss/main.scss' ], works too. 还有条目:['。/ js / main.js','。/ scss / main.scss'],也可以。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.