vue-cli3 vue.config.js common configuration

basis:

= module.exports {
   // Options ... 
}

Use publicPath find the path to the server ( back end api and projects in the same directory )

module.exports = {
  publicPath: './'
}

Packaged build project location

module.exports = {
 outputDir: 'dist',
}

code detection eslint

lintOnSave : ture | false | 'error'

devserve configuration

devServer: {
  Open: to true , // automatically open to 
  Port: 8000, // set port 
  Proxy: {
     // Set Agent 
    '/ Axios' : {
      target: 'http://101.15.22.98',
      changeOrigin: true,
      Secure: to false , // if the interface is http, configure the parameters 
      pathRewrite: {
         '^ / Axios': ''
      }
    }
  }
}

Webpack internal configuration (chaining)

const path = require('path');

function resolve(dir) {
  return path.join(__dirname, dir)
}

chainWebpack: () =>{
    config.resolve.alias
          .set('@', resolve('src'))
          .set('views', resolve('src/views'))
          .set('assets', resolve('src/assets'))
    // ......
}

 

 

vue.config.js

 1 //打包压缩 取出console.log
 2 // const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 3 
 4 const CompressionWebpackPlugin = require('compression-webpack-plugin');
 5 const productionGzipExtensions = ['js', 'css'];
 6 
 7 // const env = process.env.NODE_ENV;
 8 
 9 const path = require('path');
10 
11 function resolve(dir) {
12   return path.join(__dirname, dir)
13 }
14 
15 module.exports = {
16   publicPath: './', // settings packaged static resource path 
. 17    lintOnSave: to false ,
 18 is  
. 19    chainWebpack: (config) => {
 20 is  
21 is      config.resolve.alias
 22 is          .set ( '@', Resolve ( 'the src' ))
 23 is          .set ( 'Assets', Resolve (' the src / Assets' ))
 24          .set ( 'Components', Resolve (' the src / Components' ))
 25          .set ( 'views', Resolve (' the src / views ' ))
 26 is          .set (' static ', Resolve (' the src / static ' ))
 27    },
28 
29   configureWebpack: (config) => {
30     if (process.env.NODE_ENV === "development") {
31       config.devtool = 'source-map'
32     } else {
33 
34       config.plugins.push(new CompressionWebpackPlugin({
35         algorithm: 'gzip',
36         test: new RegExp(`\\.(${productionGzipExtensions.join('|')})$`),
37         threshold: 10240,
38         minRatio: 0.8,
39       }));
40 
41       // config.plugins.push(
42       //     new UglifyJsPlugin({
43       //       uglifyOptions: {
44       //         compress: {
45       //           drop_debugger: true, // console
46       //           drop_console: true,
47       //         },
48       //       },
49       //       sourceMap: false,
50       //       parallel: true,
51       //     }),
52       // )
53     }
54   },
55 
56   devServer: {
57     open: true, // automatically open to 
58      Port: 8000, // set the port 
59      / * Proxy: {
 60        // set the proxy
 61 is        '/ Axios': {
 62 is          target: 'http://101.15.22.98',
 63 is          changeOrigin: to true ,
 64          Secure: to false, http // if the interface is, the configuration parameters need to
 65          pathRewrite: {
 66            '^ / Axios': ''
 67          }
 68        }
 69      } * / 
70    }
 71 is  
72 };