Vue Cli configuration: vue.config.js

 

Vue Cli 3 generating project structure, not build, config directory, but the use of vue.config.js be configured.

 

vue.config.js It is an optional configuration file, if the project (and  package.json the existence of this document at the same level) in the root directory, then it will be  @vue/cli-service loaded automatically.

You can also use  package.json the  vue field, but note that such an approach requires you to strictly comply with JSON format to write.

 

View a version of Vue Cli

 

view - Version

 3.5.1

 

Two profiles created vue.config.js

 

= module.exports {
   // the baseUrl from Vue CLI 3.3 from deprecated, use publicPath 
  // default, Vue CLI will assume that your application is deployed on a root domain, e.g. https: // www .my-app.com /. 
  // If the application is deployed on a sub path, you need to specify the sub path with this option. For example, if your application is deployed in https://www.my-app.com/my-app/, publicPath is set to / my-app /. 
  publicPath: 
    process.env.NODE_ENV === "Production's" "/ Sub-path-Production's /":? "/" ,
   // generated when running vue-cli-service build the production environment build directory files. 
  // Note that the target directory before building will be cleared (incoming --no-clean behavior can be turned off when the building). 
  // Default 'dist' 
  outputDir: "My-App" ,
   // placed generated static resources (js, css, img, fonts ) directory (directory with respect outputDir). 
  // defaults ''
  assetsDir: "Assets" ,
   // the specified output path generated index.html (relative outputDir). It can also be an absolute path. 
  // defaults 'index.html' 
  indexPath: "myIndex.html" ,
   // default, generated static resource contains the hash in order to better control cache in their file names. 
  filenameHashing: false ,
   // whether in the development environment by eslint-loader lint code every time you save. This value will be / become effective after being installed @ vue cli-plugin-eslint. 
  lintOnSave:! process.env.NODE_ENV == "Production's" , 

  // whether to use the build Vue contains the runtime compiler. Set to true you can use the template option in the Vue assembly is, but it makes you extra applications increased by about 10kb. 
  runtimeCompiler: false , 

  // if you do not have source map production environment, it can be set to false in order to accelerate the construction of a production environment. 
  productionSourceMap:false , 

  // all webpack-dev-server options are supported. 
  devserver: { 
    Host: "localhost" , 
    Port: 8080, // port number 
    HTTPS: false , 
    Open: to true , // configuration automatically activate the browser 

    // configure multiple proxy 
    Proxy: {
       "/ API" : { 
        target: " HTTP: // localhost: 3000 ", // local analog data server 
        changeOrigin: to true , 
        pathRewrite: {
           " ^ / api ":" " // interface address of the string removed api 
        } 
      },
       " / foo ": { 
        Target: "HTTP: // localhost: 8080", // local analog data server 
        changeOrigin: to true , 
        pathRewrite: {
           "^ / foo": "" // remove the foo interface address string 
        } 
      } 
    } 
  } 
} ;