feat: 优化打包

.github/workflows/release.yml

@@ -33,6 +33,9 @@ jobs:
       - name: Install
         run: nci
 
+      - name: Build
+        run: npx ni build
+
       - name: Release
         run: |
           if [[ ${{ github.ref }} == *refs/tags/*-beta* ]]; then

.gitignore

@@ -6,4 +6,5 @@ logs
 /.stylelintcache
 .eslintcache
 build/font/
-build/demo.js
+build/demo.js
+lib/

package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "precommit": "lint-staged",
     "start": "webpack-dev-server --hot",
-    "build": "webpack -p",
+    "build": "webpack --progress --colors --config ./webpack.prod.config.js",
     "locale": "i18n-m sync src/",
     "release": "bumpp"
   },
@@ -23,6 +23,10 @@
   "types": "global.d.ts",
   "author": "",
   "license": "ISC",
+  "files": [
+    "lib",
+    "global.d.ts"
+  ],
   "bugs": {
     "url": "https://github.com/gmfe/gm-printer/issues"
   },
@@ -106,6 +110,7 @@
     "terser-webpack-plugin": "^2.3.8",
     "url-loader": "^1.1.2",
     "webpack": "^4.47.0",
+    "webpack-bundle-analyzer": "^4.10.1",
     "webpack-cli": "^3.3.12",
     "webpack-dev-server": "^3.11.3"
   }

webpack.dev.config.js

@@ -0,0 +1,80 @@
+const webpack = require('webpack')
+const path = require('path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+
+module.exports = {
+  mode: 'development',
+  entry: {
+    demo: './demo/index.js'
+  },
+  output: {
+    path: path.resolve('build'),
+    publicPath: '/',
+    filename: '[name].js'
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        use: 'babel-loader'
+      },
+      {
+        test: /\.less$/,
+        use: ['style-loader', 'css-loader', 'postcss-loader', 'less-loader']
+      },
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'css-loader']
+      },
+      {
+        test: /(fontawesome-webfont|glyphicons-halflings-regular|iconfont)\.(woff|woff2|ttf|eot|svg)($|\?)/,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              limit: 1024,
+              name: 'font/[name].[ext]'
+            }
+          }
+        ]
+      },
+      {
+        test: /\/svg\/(\w|\W)+\.svg$/,
+        use: [
+          {
+            loader: '@svgr/webpack',
+            options: {
+              icon: true,
+              expandProps: 'start',
+              svgProps: {
+                fill: 'currentColor',
+                // className 冗余
+                className:
+                  "{'gm-svg-icon t-svg-icon m-svg-icon ' + (props.className || '')}"
+              }
+            }
+          }
+        ]
+      }
+    ]
+  },
+  plugins: [
+    new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /zh-cn/),
+    new HtmlWebpackPlugin({
+      template: 'demo/index.html'
+    })
+  ],
+  devServer: {
+    open: true,
+    compress: true,
+    port: 5678,
+    inline: false,
+    disableHostCheck: true,
+    proxy: {
+      '/gm_account/*': {
+        target: 'https://manage.guanmai.cn',
+        changeOrigin: true
+      }
+    }
+  }
+}

webpack.prod.config.js

@@ -0,0 +1,85 @@
+const webpack = require('webpack')
+const path = require('path')
+const  BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
+
+module.exports = {
+  mode: 'production',
+  entry: './src/index.js',
+  output: {
+    path: path.resolve('lib'),
+    publicPath: '/',
+    libraryTarget: 'commonjs',
+    filename: '[name].js'
+  },
+  externals: {
+    react: 'react',
+    'react-dom': 'react-dom',
+    'mobx': 'mobx',
+    'mobx-react': 'mobx-react',
+    'lodash': 'lodash',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        use: 'babel-loader'
+      },
+      {
+        test: /\.less$/,
+        use: ['style-loader', 'css-loader', 'postcss-loader', 'less-loader']
+      },
+      {
+        test: /\.css$/,
+        use: ['style-loader', 'css-loader']
+      },
+      {
+        test: /(fontawesome-webfont|glyphicons-halflings-regular|iconfont)\.(woff|woff2|ttf|eot|svg)($|\?)/,
+        use: [
+          {
+            loader: 'url-loader',
+            options: {
+              limit: 1024,
+              name: 'font/[name].[ext]'
+            }
+          }
+        ]
+      },
+      {
+        test: /\/svg\/(\w|\W)+\.svg$/,
+        use: [
+          {
+            loader: '@svgr/webpack',
+            options: {
+              icon: true,
+              expandProps: 'start',
+              svgProps: {
+                fill: 'currentColor',
+                // className 冗余
+                className:
+                  "{'gm-svg-icon t-svg-icon m-svg-icon ' + (props.className || '')}"
+              }
+            }
+          }
+        ]
+      }
+    ]
+  },
+  plugins: [
+    new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /zh-cn/),
+    // new BundleAnalyzerPlugin(),
+  ],
+  devServer: {
+    open: true,
+    compress: true,
+    port: 5678,
+    inline: false,
+    disableHostCheck: true,
+    proxy: {
+      '/gm_account/*': {
+        target: 'https://manage.guanmai.cn',
+        changeOrigin: true
+      }
+    }
+  }
+}