build: optimize command argument open

tjx666 · Apr 13, 2020 · a706e49 · a706e49
1 parent 85d477c
commit a706e49
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 15 deletions.
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -9,5 +9,10 @@
         "mrmlnc.vscode-scss",
         "yutengjing.view-github-repository",
         "yutengjing.open-in-external-app"
+    ],
+    "unwantedRecommendations": [
+        "hookyqr.beautify",
+        "ms-vscode.vscode-typescript-tslint-plugin",
+        "dbaeumer.jshint"
     ]
 }
diff --git a/scripts/build.ts b/scripts/build.ts
@@ -11,11 +11,10 @@ compiler.run((error, stats) => {
         return;
     }
 
-    const prodStatsOpts = {
+    const analyzeStatsOpts = {
         preset: 'normal',
-        modules: ENABLE_ANALYZE,
         colors: true,
     };
 
-    console.log(stats.toString(prodStatsOpts));
+    console.log(stats.toString(ENABLE_ANALYZE ? 'minimal' : analyzeStatsOpts));
 });
diff --git a/scripts/configs/webpack.common.ts b/scripts/configs/webpack.common.ts
@@ -102,7 +102,8 @@ const commonConfig: Configuration = {
         new CopyPlugin(
             [
                 {
-                    from: '*',
+                    context: PROJECT_ROOT,
+                    from: 'public/*',
                     to: resolve(PROJECT_ROOT, './dist'),
                     toType: 'dir',
                     ignore: ['index.html'],

diff --git a/scripts/configs/webpack.prod.ts b/scripts/configs/webpack.prod.ts
@@ -1,5 +1,5 @@
 import { resolve } from 'path';
-import { BannerPlugin } from 'webpack';
+import { BannerPlugin, HashedModuleIdsPlugin } from 'webpack';
 import merge from 'webpack-merge';
 import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
@@ -20,6 +20,7 @@ const mergedConfig = merge(commonConfig, {
             raw: true,
             banner: COPYRIGHT,
         }),
+        new HashedModuleIdsPlugin(),
         new ForkTsCheckerWebpackPlugin({
             // 生产环境打包并不频繁，可以适当调高允许使用的内存，加快类型检查速度
             memoryLimit: 1024 * 2,
@@ -32,20 +33,22 @@ const mergedConfig = merge(commonConfig, {
             ignoreOrder: false,
         }),
         new CompressionPlugin({ cache: true }),
-        new SizePlugin({ writeFile: false }),
     ],
     optimization: {
+        runtimeChunk: 'single',
         minimize: true,
         minimizer: [new TerserPlugin({ extractComments: false }), new OptimizeCSSAssetsPlugin()],
     },
 });
 
-const smp = new SpeedMeasurePlugin();
-const prodConfig = smp.wrap(mergedConfig);
+// eslint-disable-next-line import/no-mutable-exports
+let prodConfig = mergedConfig;
 
+// 使用 --analyze 参数构建时，会输出各个阶段的耗时和自动打开浏览器访问 bundle 分析页面
 if (ENABLE_ANALYZE) {
-    // 使用 --analyze 参数构建时，会自动打开浏览器访问 bundle 分析页面
-    mergedConfig.plugins!.push(new BundleAnalyzerPlugin());
+    prodConfig.plugins!.push(new SizePlugin({ writeFile: false }), new BundleAnalyzerPlugin());
+    const smp = new SpeedMeasurePlugin();
+    prodConfig = smp.wrap(mergedConfig);
 }
 
 export default prodConfig;
diff --git a/scripts/utils/constants.ts b/scripts/utils/constants.ts
@@ -3,7 +3,6 @@ import { argv } from 'yargs';
 
 const __DEV__ = process.env.NODE_ENV !== 'production';
 const ENABLE_ANALYZE = !!argv.analyze;
-const ENABLE_OPEN = !!argv.open;
 
 const HOST = '127.0.0.1';
 const DEFAULT_PORT = 3000;
@@ -19,7 +18,6 @@ export {
     HOST,
     DEFAULT_PORT,
     COPYRIGHT,
-    ENABLE_OPEN,
     PROJECT_NAME,
     PROJECT_ROOT,
     HMR_PATH,

diff --git a/scripts/utils/openBrowser.ts b/scripts/utils/openBrowser.ts
@@ -1,13 +1,16 @@
+import { argv } from 'yargs';
 import open from 'open';
 import { Compiler, Stats } from 'webpack';
 
-import { ENABLE_OPEN } from './constants';
-
 /**
  * 一个 webpack 插件，在第一次编译成功时打开浏览器访问 devServer 首页
  */
 export default function openBrowser(compiler: Compiler, address: string) {
-    if (ENABLE_OPEN) {
+    const openArgument = argv.open;
+    if (openArgument) {
+        if (typeof openArgument === 'string') {
+            address = openArgument;
+        }
         let hadOpened = false;
         compiler.hooks.done.tap('open-browser-plugin', async (stats: Stats) => {
             if (!hadOpened && !stats.hasErrors()) {