feat: use optimization config

config/plugin.js

@@ -55,69 +55,69 @@ exports.define = {
   }
 };
 
-exports.commonsChunk = {
-  enable() {
-    const config = this.config;
-    return !config.dll && !(config.optimization && config.optimization.splitChunks);
-  },
-  type: 'client',
-  name: webpack.optimize.SplitChunksPlugin,
-  action: 'merge',
-  args() {
-    const packKeys = Object.keys(this.packs || {});
-    const chunks = Object.keys(this.webpackConfig.entry || {}).filter(entry => {
-      return !packKeys.includes(entry);
-    });
-    const lib = this.utils.isObject(this.config.lib) ? this.config.lib : {};
-    const name = lib.name || 'common';
-    return {
-      name,
-      chunks
-    };
-  }
-};
+// exports.commonsChunk = {
+//   enable() {
+//     const config = this.config;
+//     return !config.dll && !(config.optimization && config.optimization.splitChunks);
+//   },
+//   type: 'client',
+//   name: webpack.optimize.SplitChunksPlugin,
+//   action: 'merge',
+//   args() {
+//     const packKeys = Object.keys(this.packs || {});
+//     const chunks = Object.keys(this.webpackConfig.entry || {}).filter(entry => {
+//       return !packKeys.includes(entry);
+//     });
+//     const lib = this.utils.isObject(this.config.lib) ? this.config.lib : {};
+//     const name = lib.name || 'common';
+//     return {
+//       name,
+//       chunks
+//     };
+//   }
+// };
 
-exports.runtime = {
-  enable() {
-    return this.isUse('commonsChunk');
-  },
-  type: 'client',
-  name: webpack.optimize.RuntimeChunkPlugin,
-  action: 'merge',
-  args() {
-    const config = this.config;
-    const runtimeChunk = config.optimization && config.optimization.runtimeChunk;
-    const name = this.utils.isObject(runtimeChunk) && runtimeChunk.name;
-    return {
-      name: name || 'runtime'
-    };
-  }
-};
+// exports.runtime = {
+//   enable() {
+//     return this.isUse('commonsChunk');
+//   },
+//   type: 'client',
+//   name: webpack.optimize.RuntimeChunkPlugin,
+//   action: 'merge',
+//   args() {
+//     const config = this.config;
+//     const runtimeChunk = config.optimization && config.optimization.runtimeChunk;
+//     const name = this.utils.isObject(runtimeChunk) && runtimeChunk.name;
+//     return {
+//       name: name || 'runtime'
+//     };
+//   }
+// };
 
-exports.uglifyJs = {
-  enable() {
-    const config = this.config;
-    return !(config.optimization && config.optimization.minimize);
-  },
-  env: ['prod'],
-  name: 'uglifyjs-webpack-plugin',
-  args: {
-    cache: true,
-    parallel: 2,
-    sourceMap: true,
-    uglifyOptions: {
-      warnings: false,
-      compress: {
-        dead_code: true,
-        drop_console: true,
-        drop_debugger: true
-      },
-      output: {
-        comments: false
-      }
-    }
-  }
-};
+// exports.uglifyJs = {
+//   enable() {
+//     const config = this.config;
+//     return !(config.optimization && config.optimization.minimize);
+//   },
+//   env: ['prod'],
+//   name: 'uglifyjs-webpack-plugin',
+//   args: {
+//     cache: true,
+//     parallel: 2,
+//     sourceMap: true,
+//     uglifyOptions: {
+//       warnings: false,
+//       compress: {
+//         dead_code: true,
+//         drop_console: true,
+//         drop_debugger: true
+//       },
+//       output: {
+//         comments: false
+//       }
+//     }
+//   }
+// };
 
 exports.manifest = {
   enable: true,

lib/base.js

@@ -218,22 +218,7 @@ class WebpackBaseBuilder extends Config {
   }
 
   getCommonsChunk(useRuntime = true) {
-    let commonsChunks = [];
-    if (useRuntime) {
-      const runtime = this.getPluginByName('runtime');
-      if (runtime && runtime.enable) {
-        if (runtime.args) {
-          commonsChunks = commonsChunks.concat(runtime.args.names || runtime.args.name || []);
-        }
-      }
-    }
-    const common = this.getPluginByName('commonsChunk');
-    if (common && common.enable) {
-      if (common.args) {
-        commonsChunks = commonsChunks.concat(common.args.names || common.args.name || []);
-      }
-    }
-    return commonsChunks;
+    return this.webpackOptimize.getCommonsChunk();
   }
 
 
@@ -539,14 +524,19 @@ class WebpackBaseBuilder extends Config {
     });
   }
 
+  createOptimization() {
+    return this.webpackOptimize.getOptimization();
+  }
+
   combineWebpackConfig(config) {
     this.t3 = Date.now();
     const buildWebpackConfig = {
       output: this.createOutput(config),
       module: {
         rules: this.createWebpackLoader(config)
       },
-      plugins: this.createWebpackPlugin(config)
+      plugins: this.createWebpackPlugin(config),
+      optimization: this.createOptimization(config)
     };
     const webpackConfig = this.mergeWebpackConfig(this.nativeWebpackConfig, buildWebpackConfig);
     this.t4 = Date.now();

lib/client.js

@@ -54,6 +54,10 @@ class WebpackClientBuilder extends WebpackBaseBuilder {
     }
   }
 
+  createOptimization() {
+    return this.webpackOptimize.getWebOptimization();
+  }
+
   createHotEntry() {
     if (this.hot) {
       const hotMiddleware = require.resolve('webpack-hot-middleware').split(path.sep);
@@ -131,8 +135,9 @@ class WebpackClientBuilder extends WebpackBaseBuilder {
           } : false;
           const commonsChunk = this.getCommonsChunk();
           const dllChunks = this.getDLLChunk();
-          const chunks = [].concat(dllChunks.names).concat(commonsChunk).concat(entryName);
+          const chunks = [].concat(dllChunks.names).concat(commonsChunk);
           if (!commonsChunk.includes(entryName)) {
+            chunks.push(entryName);
             this.plugins[entryName] = this.merge({ args: { minify, chunks, filename, template, css, js } }, plugin);
           }
         });

lib/config.js

@@ -7,6 +7,7 @@ const webpack = WebpackTool.webpack;
 const merge = WebpackTool.merge;
 const utils = require('../utils/utils');
 const uniq = require('lodash.uniq');
+const WebpackOptimize = require('./optimize');
 const Logger = require('../utils/logger');
 const Adapter = require('../utils/adapter');
 const zero = require('./zero');
@@ -31,7 +32,7 @@ class Config {
     this.beforeCreateQueue = [];
     this.webpackNodeList = [
       'context', 'mode', 'target', 'node', 'output', 'externals', 'resolve', 'watch', 'watchOptions', 'amd',
-      'resolveLoader', 'devServer', 'performance', 'module', 'profile', 'stats', 'cache', 'optimization'
+      'resolveLoader', 'devServer', 'performance', 'module', 'profile', 'stats', 'cache'
     ];
     this.webpackModuleRuleKeys = [
       'test', 'use', 'include', 'exclude', 'issuer', 'loader', 'oneOf', 'options', 'parser', 'resource',
@@ -52,6 +53,7 @@ class Config {
     };
     this.logger = new Logger(this.config.logger, this);
     this.adapter = new Adapter(this);
+    this.webpackOptimize = new WebpackOptimize(this);
     this.initZero(this.config);
     this.initEntry(this.config);
     this.initialize(this.config);
@@ -220,7 +222,7 @@ class Config {
       this.dev = true;
       this.mergeConfig(defaultConfig.devConfig);
     }
-    this.webpackConfig.mode = this.test || this.prod ? 'production' : 'development';
+    this.webpackConfig.mode = this.prod ? 'production' : 'development';
   }
 
   initEntry(config) {
@@ -453,8 +455,14 @@ class Config {
       this.webpackConfig.devtool = cliDevtool;
     } else if (cliDevtool === true) {
       this.webpackConfig.devtool = 'source-map';
-    } else if (devtool && this.dev) { /* istanbul ignore next */
-      this.webpackConfig.devtool = devtool;
+    } else if (devtool) { /* istanbul ignore next */
+      if (this.dev) {
+        this.webpackConfig.devtool = devtool;
+      } else {
+        this.webpackConfig.devtool = false;
+      }
+    } else {
+      this.webpackConfig.devtool = false;
     }
   }
 

lib/optimize.js

@@ -0,0 +1,61 @@
+'use strict';
+module.exports = class WebpackOptimize {
+  constructor(ctx) {
+    this.ctx = ctx;
+  }
+
+  getCommonsChunk() {
+    const commonsChunks = [];
+    const optimization = this.getWebOptimization();
+    const { runtimeChunk = {}, splitChunks = {} } = optimization;
+    const { cacheGroups = {} } = splitChunks;
+    if (runtimeChunk.name) {
+      commonsChunks.push(runtimeChunk.name);
+    }
+    Object.keys(cacheGroups).forEach(key => {
+      const group = cacheGroups[key];
+      const name = group.name || key;
+      if (!commonsChunks.includes(name)) {
+        commonsChunks.push(name);
+      }
+    });
+    return commonsChunks;
+  }
+
+  getOptimization() {
+    return {};
+  }
+
+  getWebOptimization() {
+    return {
+      runtimeChunk: {
+        name: 'runtime'
+      },
+      splitChunks: {
+        chunks: 'async',
+        minSize: 30000,
+        maxAsyncRequests: 5,
+        maxInitialRequests: 3,
+        name: false,
+        cacheGroups: {
+          common: {
+            name: 'common',
+            chunks: 'initial',
+            minChunks: 2,
+            test: /node_modules\/(.*)\.js/
+          },
+          styles: {
+            name: 'common',
+            chunks: 'all',
+            minChunks: 2,
+            test: /\.(css|less|scss|stylus)$/
+          }
+        }
+      }
+    };
+  }
+
+  getNodeOptimization() {
+    return this.getOptimization();
+  }
+};

lib/server.js

@@ -43,6 +43,10 @@ class WebpackServerBuilder extends WebpackBaseBuilder {
     }
     return super.createOutput();
   }
+
+  createOptimization() {
+    return this.webpackOptimize.getNodeOptimization();
+  }
 }
 WebpackServerBuilder.TYPE = 'server';
 WebpackServerBuilder.TARGET = 'node';

package.json

@@ -71,7 +71,6 @@
     "less": "^2.7.2",
     "less-loader": "^4.0.5",
     "mocha": "^3.4.2",
-    "node-sass": "^4.5.3",
     "node-tool-utils": "^1.0.0",
     "nyc": "^11.1.0",
     "sass-loader": "^6.0.6",