ok picture worth 1000 words:
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
the first time start watch happening expect. save change , webpack kicked off noticed 2 steps missed (i put dashed line distinguish between first call , second call):
- 1 plugin i'm using (
clean-webpack-plugin
) isn't being callled - console.log statement have @ top of webpack.config file isn't being called.
here webpack.config.js file:
/// <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 regular file instead of 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"] } }
why console.log missed, , more importantely, clean-webpack-plugin
?
Comments
Post a Comment