vue.config.js 一些配置

const path = require('path');

// 設置文件路徑別名方法
function resolve(dir) {
  return path.join(__dirname, dir);
}

module.exports = {  
  // publicPath: './', // 公共路徑
  //如果使用了history.pushState pages的路由時； 選項構建多頁面應用時；
  publicPath: process.env.NODE_ENV === 'production'
    ? './'
    : '/',
  outputDir: 'xlz',  // 打包(build)生成文件目錄 默認dist
  assetsDir: '', // 默認不寫或空，css js img文件夾都將放置在根目錄下，所有的靜態文件放置路徑
  indexPath: 'index.html', // 指定打包生成的index.html放置的路徑 例：xlz/index.html，index.html將被放置在dist/xlz/index.html
  lintOnSave: false, // 是否開啓eslint保存檢測，有效值：ture | false | 'error'
  productionSourceMap: false,  // 設置爲true的時候,打包完成後生成一些js.map文件,如果有報錯,可以精確的輸出哪一個文件、哪一行報錯
  css:{
    sourceMap: false, // 設置爲true的時候 打包完成後會生成一些css.map文件,如果有報錯,可以精確的輸出哪一個文件、哪一行報錯
    extract: true, // 是否使用 css 分離插件 ExtractTextPlugin，採用獨立樣式文件載入，不採用 <style> 方式內聯至 html 文件中
    requireModuleExtension: true // 開啓module <style module></style>
  },
  devServer:{
    open: true, // 啓動後是否自動打開瀏覽器
    host: 'localhost', // 默認是localhost 設置啓動的服務器地址 可設置爲192.168.0.0本地ip方式 
    port: '8082', // 啓動服務端口號
    // index: '/account.html',   //啓動項目後，默認進入的頁面地址
    proxy:{ // 使用對象的方式設置多個代理
      'api':{
        target: 'http://192.168.0.0:8080',   // 替換成需要請求的接口地址
        ws: true,  // 允許跨域
        changeOrigin: true,  
        pathRewrite: {
          '^/api': '/'  // 替換target中的請求地址 請求地址直接使用 /login的形式
        }
      },
      '/foo': {
        target: '<other_url>'
      }
    }
  },
  configureWebpack: config => {
    // 必須添加環境判斷代碼，因爲development(開發)環境下config.optimization是undefined 
    if (process.env.NODE_ENV === 'production') {
      // 爲生產環境修改配置...
      // 去掉所有console.log()
      config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true;
    } else {
        // 爲開發環境修改配置...
    }
  },
  chainWebpack: config =>{
    // 設置文件路徑別名(需要配合頂部的方法)
    config.resolve.alias
      .set('@', resolve('src'))
      .set('assets', resolve('src/assets'))
  },
  pluginOptions:{
    // 第三方插件配置
  }
}

如果本篇文章對你有幫助的話，很高興能夠幫助上你。

當然，如果你覺得文章有什麼讓你覺得不合理、或者有更簡單的實現方法又或者有理解不來的地方，希望你在看到之後能夠在評論裏指出來，我會在看到之後儘快的回覆你。