好的,一张图片值1000字:
C:\gitrepo\dev\Web\Secured Account Access\Member [erochanges +101 ~4 -0 !]> webpack -d --watch
Webpack build starting: 1/8/2016 @ 11:26:38
clean-webpack-plugin: C:\gitrepo\dev\Web\Secured Account Access\Member\build\js has been removed.
Hash: 51337dd0be7daf80bbaf
Version: webpack 1.13.1
Time: 4923ms
Asset Size Chunks Chunk Names
fetchpolyfill.0d39e51d8193e9047bf8.js 12.7 kB [emitted]
babel-polyfill.a0f0baed01fffd04dd66.min.js 242 bytes 0 [emitted] babel-polyfill
errorValidator.92845383126defed29e7.min.js 246 bytes 2 [emitted] errorValidator
fetchpolyfill.0d39e51d8193e9047bf8.min.js 7.01 kB 3 [emitted] fetchpolyfill
paymentoptions.217e18de338d68b7686f.min.js 12 kB 4 [emitted] paymentoptions
common.1524774d345143c7bf98.min.js 170 kB 5 [emitted] common
babel-polyfill.a0f0baed01fffd04dd66.js 260 bytes [emitted]
confirm.0169b72e33797a5d8946.js 17.3 kB [emitted]
errorValidator.92845383126defed29e7.js 264 bytes [emitted]
confirm.0169b72e33797a5d8946.min.js 5.83 kB 1 [emitted] confirm
paymentoptions.217e18de338d68b7686f.js 21.7 kB [emitted]
common.1524774d345143c7bf98.js 450 kB [emitted]
babel-polyfill.a0f0baed01fffd04dd66.min.js.map 667 bytes 0 [emitted] babel-polyfill
confirm.0169b72e33797a5d8946.min.js.map 41 kB 1 [emitted] confirm
errorValidator.92845383126defed29e7.min.js.map 671 bytes 2 [emitted] errorValidator
fetchpolyfill.0d39e51d8193e9047bf8.min.js.map 34.2 kB 3 [emitted] fetchpolyfill
paymentoptions.217e18de338d68b7686f.min.js.map 57.3 kB 4 [emitted] paymentoptions
common.1524774d345143c7bf98.min.js.map 1.06 MB 5 [emitted] common
[0] multi babel-polyfill 28 bytes {0} [built]
[0] ./confirm.js 3.07 kB {1} [built]
[0] multi errorValidator 28 bytes {2} [built]
[0] multi fetchpolyfill 28 bytes {3} [built]
[0] multi paymentoptions 28 bytes {4} [built]
[314] ./errorValidator.js 757 bytes {5} [built]
[315] ./vendor/fetchpolyfill.js 52 bytes {3} {4} [built]
[317] ./paymentoptions.js 8.56 kB {4} [built]
+ 314 hidden modules
----------------------------------------------------------------------------
Hash: dfaf3d5b8e90ad0cbbd1
Version: webpack 1.13.1
Time: 3431ms
Asset Size Chunks Chunk Names
confirm.4223b8e2ab9faa4d53bd.min.js 5.83 kB 1 [emitted] confirm
common.d88bf4fa955260af5738.min.js 170 kB 5 [emitted] common
babel-polyfill.a0f0baed01fffd04dd66.js 260 bytes [emitted]
confirm.4223b8e2ab9faa4d53bd.js 17.3 kB [emitted]
errorValidator.92845383126defed29e7.js 264 bytes [emitted]
fetchpolyfill.0d39e51d8193e9047bf8.js 12.7 kB [emitted]
paymentoptions.217e18de338d68b7686f.js 21.7 kB [emitted]
common.d88bf4fa955260af5738.js 450 kB [emitted]
confirm.4223b8e2ab9faa4d53bd.min.js.map 41 kB 1 [emitted] confirm
common.d88bf4fa955260af5738.min.js.map 1.06 MB 5 [emitted] common
[0] ./confirm.js 3.06 kB {1} [built]
+ 321 hidden modules
我第一次启动手表时,一切都在发生,正如我所期待的那样。一旦我保存更改并且webpack启动,你会发现错过了两个步骤(我用虚线表示第一次通话和第二次通话):
clean-webpack-plugin
)并未被调用这是我的webpack.config.js文件:
/// <binding ProjectOpened='Watch - Development' />
let fs = require('fs');
let path = require('path');
let webpack = require('webpack');
let currentDate = new Date();
console.log("Webpack build starting: " +
currentDate.getDate() +
"/" +
(currentDate.getMonth() + 1) +
"/" +
currentDate.getFullYear() +
" @ " +
currentDate.getHours() +
":" +
currentDate.getMinutes() +
":" +
currentDate.getSeconds());
//webpack plugins
let cleanWebPackPlugin = require('clean-webpack-plugin');
let assetPlugin = require('assets-webpack-plugin');
let webpackOnBuildPlugin = require('on-build-webpack');
let isProd = (JSON.stringify(process.env.NODE_ENV.replace(/\"/g, "") || 'prod') === '"prod"');
let plugins = [
new cleanWebPackPlugin(['build/js'], {
root: path.resolve('.'),
verbose: true,
dry: false
}),
new webpack.optimize.CommonsChunkPlugin('common', 'common.[chunkhash].min.js', 3),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new assetPlugin(
{
path: path.resolve('build/js/')
}),
new webpackOnBuildPlugin(function (stats) {
if (!isProd) {
//when in dev return the regular file instead of the minified file.
String.prototype.replaceAll = function (search, replacement) {
var target = this;
return target.split(search).join(replacement);
};
fs.readFile(path.resolve('build/js/webpack-assets.json'), 'utf8', function (err, data) {
var results = data.replaceAll(".min", "");
fs.writeFile(path.resolve('build/js/webpack-assets.json'),
results,
"utf8",
function (err) {
if (err) return console.log(err);
});
});
}
})
];
if (!isProd) {
let unminifiedWebpackPlugin = require('unminified-webpack-plugin');
plugins.push(new unminifiedWebpackPlugin());
}
module.exports = {
context: path.resolve('scripts'),
entry: {
confirm: "./confirm",
"fetchpolyfill": ["./vendor/fetchpolyfill"],
"errorValidator": ["./errorValidator"],
'paymentoptions': ["./paymentoptions"],
'babel-polyfill': ['babel-polyfill']
},
output: {
path: path.resolve('build/js/'),
publicPath: '/build/js/',
chunkFilename: "[name]" + ".[chunkhash].js",
filename: "[name]" + ".[chunkhash].min.js"
},
plugins: plugins,
module: {
loaders: [
{
test: /\.es6$/,
exclude: ["/Scripts/vendor/", "node_modules"],
loader: "babel-loader"
}
]
},
resolve: {
extensions: ["", ".js", ".es6"]
}
}
为什么我的console.log错过了,而且更重要的是,我的clean-webpack-plugin
?