webpack build

@@ -9,9 +9,15 @@
 const fs = require('fs');
 
 const gulp = require('gulp');
+const gutil = require('gulp-util');
 const postcss = require('gulp-postcss');
 const sourcemaps = require('gulp-sourcemaps');
 const cssnano = require('gulp-cssnano');
+const webpack = require('webpack');
+const webpackStream = require('webpack-stream');
+const WebpackDevServer = require('webpack-dev-server');
+
+const _ = require('lodash');
 
 const env = {
     dev: Symbol('development'),
@@ -33,6 +39,8 @@ const dist = {
     font: `${rootdir}/assets/font`
 };
 
+const webpackConfig = require('./webpack.config.js');
+
 /**
  * postcss plugins for both dev and pro
  * @parem et Symbol
@@ -105,6 +113,12 @@ const postcssPlugin = (et, module) => {
 };
 
 /**
+ * 返回发布目录对应模块的根目录
+ * @param module String 模块名
+ */
+const distModule = module => `./dist/${config.name}/${config.version}/${module}/`;
+
+/**
  * 模块下CSS编译
  * @param module String 模块名
  * @param et Symbol 环境
@@ -120,7 +134,7 @@ const compileForModule = (module, et) => {
         return gulp.src(`static/module/${module}/scss/index.css`)
                 .pipe(postcss(postcssPlugin(et, module)))
                 .pipe(cssnano())
-                .pipe(gulp.dest(`./dist/${config.name}/${config.version}/${module}/`));
+                .pipe(gulp.dest(distModule(module)));
     }
 };
 
@@ -169,6 +183,52 @@ gulp.task('postcss-watch', () => {
     });
 });
 
+// webpack-server
+gulp.task('webpack', () => {
+    var proConfig = Object.assign({}, webpackConfig);
+
+    proConfig.plugins.push(
+        new webpack.optimize.DedupePlugin(),
+        new webpack.optimize.UglifyJsPlugin()
+    );
+
+    fs.readdir('static/module', (err, data) => {
+        if (err) {
+            console.log(err);
+            return;
+        }
+
+        for (let f of data) {
+            gulp.src(`static/module/${f}/js/index.js`)
+                .pipe(webpackStream(proConfig))
+                .pipe(gulp.dest(distModule(f)))
+        }
+    });
+});
+
+gulp.task('webpack-dev', () => {
+    new WebpackDevServer(webpack({
+        entry: './static/module',
+        output: {
+            filename: 'bundle.js'
+        }
+    }), {
+        // contentBase: 'http://localhost/',
+        // hot: true,
+        // filename: 'bundle.js',
+        // lazy: true
+        inline: true,
+        stats: {
+            clors: true
+        }
+    }).listen(8000, 'localhost', (err) => {
+        if (err) {
+            throw new gutil.PluginError('webpack-server', err);
+        }
+        gutil.log('[webpack-serve]', 'http://localhost:8000/');
+    });
+});
+
 // assets dest
 gulp.task('assets', function() {
     return gulp.src('static/assets/**')

@@ -9,6 +9,7 @@
     "gulp-cssnano": "^2.1.2",
     "gulp-postcss": "^6.1.0",
     "gulp-sourcemaps": "^2.0.0-alpha",
+    "gulp-util": "^3.0.7",
     "imagemin": "^4.0.0",
     "postcss-assets": "^4.0.1",
     "postcss-cachebuster": "^0.1.2",
@@ -21,7 +22,10 @@
     "postcss-short": "^1.4.0",
     "postcss-sprites": "^3.1.2",
     "postcss-use": "^2.0.2",
-    "precss": "^1.4.0"
+    "precss": "^1.4.0",
+    "webpack": "^1.13.0",
+    "webpack-dev-server": "^1.14.1",
+    "webpack-stream": "^3.1.0"
   },
   "dependencies": {
     "lodash": "^4.11.1"

+/**
+ * webpack配置文件
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/4/21
+ */
+
+'use strict';
+
+const webpack = require('webpack');
+const fs = require('fs');
+const _ = require('lodash');
+
+const moduleRoot = __dirname + '/static/module';
+const entries = _.map(fs.readdirSync(moduleRoot), (d) => `./${d}/js`);
+
+module.exports = {
+    // context: moduleRoot,
+    // entry: entries,
+    // output: {
+    //     path: __dirname + '/dist',
+    //     filename: '[name].bundle.js'
+    // },
+    output: {
+        filename: 'index.js'
+    },
+    plugins: [
+        // new webpack.optimize.CommonsChunkPlugin({
+        //     name: 'lib',
+        //     minChunks: 2
+        // })
+    ]
+};
\ No newline at end of file