feat: 🎸 update webpack config

JesseCHN · Mar 16, 2020 · 7c81789 · 7c81789
1 parent 5806d4b
commit 7c81789
Show file tree

Hide file tree

Showing 7 changed files with 81 additions and 9 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -54,7 +54,9 @@
     "webpack-merge": "^4.2.2"
   },
   "dependencies": {
-    "lodash": "^4.17.15"
+    "babel-polyfill": "^6.26.0",
+    "lodash": "^4.17.15",
+    "whatwg-fetch": "^3.0.0"
   },
   "sideEffects": [
     "*.css"

diff --git a/src/index.html b/src/index.html
@@ -6,6 +6,18 @@
     <title>vue project</title>
     <meta name="description" content="created by create-vue-project">
     <meta name="keywords" content="vue project">
+    <script>
+        var modernBrowser = (
+            'fetch' in window &&
+            'assign' in Object
+        );
+        if ( !modernBrowser ) {
+        var scriptElement = document.createElement('script');
+        scriptElement.async = false;
+        scriptElement.src = '/polyfills.0b09f13d17b7ab9a7d62.js';
+        document.head.appendChild(scriptElement);
+        }
+    </script>
 </head>
 <body>
     <input type="file" accept=".xls,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"/>

diff --git a/src/polyfills.js b/src/polyfills.js
@@ -0,0 +1,2 @@
+import 'babel-polyfill';
+import 'whatwg-fetch';
diff --git a/webpack.common.js b/webpack.common.js
@@ -6,12 +6,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 module.exports = {
   entry: {
     index: './src/app.js',
-  },
-  output: {
-    path: path.resolve(__dirname, 'dist'),
-    filename: '[name].[contenthash].js',
-    chunkFilename: '[name].[contenthash].js',
-    publicPath: '',
+    polyfills: './src/polyfills.js',
   },
   target: 'web',
   plugins: [
@@ -25,6 +20,7 @@ module.exports = {
 
     },
     extensions: ['.js', '*'],
+    symlinks: false,
   },
   module: {
     rules: [
@@ -37,6 +33,7 @@ module.exports = {
       { test: /\.js$/, exclude: /node_modules/, use: 'babel-loader' },
       {
         test: /\.(png|svg|jpg|jpeg|gif)$/,
+        include: path.resolve(__dirname, 'src'),
         use: [
           {
             loader: 'url-loader',
@@ -48,6 +45,7 @@ module.exports = {
       },
       {
         test: /\.(woff|woff2|eot|ttf|otf)$/,
+        include: path.resolve(__dirname, 'src'),
         use: [
           'file-loader',
         ],

diff --git a/webpack.dev.js b/webpack.dev.js
@@ -4,6 +4,13 @@ const common = require('./webpack.common.js');
 
 module.exports = merge(common, {
   mode: 'development',
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: '[name].js',
+    chunkFilename: '[name].js',
+    publicPath: '',
+    pathinfo: false,
+  },
   devServer: {
     contentBase: path.resolve(__dirname, 'dist'),
     compress: true,
@@ -21,7 +28,8 @@ module.exports = merge(common, {
       { test: /\.css$/, exclude: /node_modules/, use: ['style-loader', 'css-loader'] },
     ],
   },
-  plugins: [],
+  plugins: [
+  ],
   devtool: 'eval-source-map',
   performance: {
     hints: 'warning',

diff --git a/webpack.prod.js b/webpack.prod.js
@@ -1,12 +1,19 @@
 const merge = require('webpack-merge');
-// const path = require('path');
+const path = require('path');
 const TerserJSPlugin = require('terser-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
 const common = require('./webpack.common.js');
 
 module.exports = merge(common, {
   mode: 'production',
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: '[name].[contenthash].js',
+    chunkFilename: '[name].[contenthash].js',
+    publicPath: '',
+    pathinfo: false,
+  },
   optimization: {
     minimizer: [
       new TerserJSPlugin({}),
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		import 'babel-polyfill';
		import 'whatwg-fetch';