javascript - Webpack build with two child or one child and duplicate files -
a have webpack config 2 child:
first - js second - css
const config = [{ name: 'js', entry: { app: './assets/js/app.js', vendor: vendor_libs }, output: { path: path.resolve(__dirname, 'assets/build'), filename: '[name].[chunkhash].js' }, module: { rules: [ { use: 'babel-loader', test: /\.jsx?$/, exclude: /node_modules/ } ] }, plugins: [ new webpack.optimize.commonschunkplugin({ names: ['vendor', 'manifest'] }), new htmlwebpackplugin({ filename: 'index.html', inject: true, }), /*new webpack.optimize.uglifyjsplugin({ compress: { warnings: false } })*/ ] }, { name: 'stylus', entry: { static: './assets/styl/core/core.styl', }, output: { path: path.resolve(__dirname, 'assets/build'), filename: '[name].[chunkhash].min.css' }, module: { rules: [ { test: /\.styl$/, loader: extracttextplugin.extract({ fallback: 'style-loader', use: [ 'css-loader?minimize!', { loader: 'postcss-loader', options: { plugins: function () { return [autoprefixer()] } } }, 'stylus-loader' ] }) }, { test: /\.(png|woff|woff2|eot|ttf|svg|jpg|jpeg)$/, loader: 'url-loader?limit=100000' } ] }, plugins: [ new extracttextplugin("[name].[chunkhash].min.css"), new htmlwebpackplugin({ filename: 'index.html', inject: true, }), ] }]
also have html-webpack-plugin
, after build have index.html file in assets/build consist of js files without css
<!doctype html> <html> <head> <meta charset="utf-8"> <title>webpack app</title> </head> <body> <script type="text/javascript" src="manifest.5ec14d4e5e7d7b4ea591.js"></script><script type="text/javascript" src="vendor.73f10ed9dfd09a1d7b34.js"></script><script type="text/javascript" src="app.97d8c94d85e06dca2ca6.js"></script></body> </html>
where .css file?
or if use 1 child config:
const config = { entry: { static: './assets/styl/core/core.styl', app: './assets/js/app.js', vendor: vendor_libs }, output: { path: path.resolve(__dirname, 'assets/build'), filename: '[name].[chunkhash].js' }, module: { rules: [ { use: 'babel-loader', test: /\.jsx?$/, exclude: /node_modules/ }, { use: ['style-loader', 'css-loader'], test: /\.css$/ }, { test: /\.styl$/, loader: extracttextplugin.extract({ fallback: 'style-loader', use: [ 'css-loader?minimize!', { loader: 'postcss-loader', options: { plugins: function () { return [autoprefixer()] } } }, 'stylus-loader' ] }) }, { test: /\.(png|woff|woff2|eot|ttf|svg|jpg|jpeg)$/, loader: 'url-loader?limit=100000' } ] }, plugins: [ new webpack.optimize.commonschunkplugin({ names: ['vendor', 'manifest'] }), new htmlwebpackplugin({ template: 'assets/index.html' }), new extracttextplugin("[name].min.css") /*new webpack.optimize.uglifyjsplugin({ compress: { warnings: false } })*/ ] }
i have right index.html file, have static.js file with:
webpackjsonp([2],{ /***/ 187: /***/ (function(module, exports) { // removed extract-text-webpack-plugin /***/ }) },[187]);
after use webpack-extraneous-file-cleanup-plugin
delete empty file, have error. kind of static.872356bd02454b5fb761.js.map ???
fs.js:1103 return binding.unlink(pathmodule._makelong(path)); ^ error: enoent: no such file or directory, unlink '/home/vladimir/www/4admin/assets/build/static.872356bd02454b5fb761.js.map' @ error (native) @ object.fs.unlinksync (fs.js:1103:18) @ object.keys.foreach.assetkey (/home/vladimir/www/4admin/node_modules/webpack-extraneous-file-cleanup-plugin/lib/plugin.js:74:10) @ array.foreach (native) @ compiler.compiler.plugin (/home/vladimir/www/4admin/node_modules/webpack-extraneous-file-cleanup-plugin/lib/plugin.js:61:37) @ compiler.applypluginsasyncseries1 (/home/vladimir/www/4admin/node_modules/tapable/lib/tapable.js:158:13) @ compiler.afteremit (/home/vladimir/www/4admin/node_modules/webpack/lib/compiler.js:357:8) @ compiler.<anonymous> (/home/vladimir/www/4admin/node_modules/webpack/lib/compiler.js:352:14) @ /home/vladimir/www/4admin/node_modules/async/dist/async.js:421:16 @ iteratorcallback (/home/vladimir/www/4admin/node_modules/async/dist/async.js:998:13) @ /home/vladimir/www/4admin/node_modules/async/dist/async.js:906:16 @ /home/vladimir/www/4admin/node_modules/graceful-fs/graceful-fs.js:43:10 @ fsreqwrap.oncomplete (fs.js:123:15)
how solve problem?
Comments
Post a Comment