项目背景：一个综合网站，开发模式为后端嵌套数据，前端开发静态页面和部分组件。
问题：gulp任务处理自动刷新、sass编译等都是极好的。但是对于js的处理并不是很好，尤其是项目需要开发组件时候，如评论组件，需要有模版、css、js[各个模块]。这时候选择用gulp感觉并不合适，当然可以选择require.js or seajs等AMD/CMD规范来开发，但是想想项目中的组件应该是独立于项目之外的，不依赖于任何第三方js，因此选择去折腾webpack+gulp来搞。几番折腾、百度之后，配置如下：
package.js
{ "name": "work", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "autoprefixer": "^6.3.6", "autoprefixer-core": "^6.0.1", "babel-core": "^6.24.1", "babel-loader": "^7.0.0", "babel-preset-es2015": "^6.24.1", "browser-sync": "^2.13.0", "cssgrace": "^3.0.0", "cssnext": "^1.8.4", "del": "^2.2.1", "extract-text-webpack-plugin": "^2.1.0", "fs": "^0.0.2", "gulp": "^3.9.1", "gulp-babel": "^6.1.2", "gulp-concat": "^2.6.0", "gulp-htmlmin": "^2.0.0", "gulp-imagemin": "^3.0.1", "gulp-jshint": "^2.0.1", "gulp-less": "^3.1.0", "gulp-livereload": "^3.8.1", "gulp-minify-css": "^1.2.4", "gulp-notify": "^2.2.0", "gulp-plumber": "^1.1.0", "gulp-postcss": "^6.1.1", "gulp-rename": "^1.2.2", "gulp-sass": "^2.3.2", "gulp-uglify": "^1.5.3", "gulp-util": "^3.0.7", "gulp-watch": "^4.3.8", "gulp-webpack": "^1.5.0", "imagemin-jpegtran": "^5.0.2", "imagemin-pngcrush": "^5.0.0", "jshint": "^2.9.2", "json-loader": "^0.5.4", "node-sass": "^4.5.2", "path": "^0.12.7", "run-sequence": "^1.2.1", "through2": "^2.0.1", "webpack": "^2.4.1" } }