vue實作跨域的配置

建立的vue項目，預設是沒有vue.config.js檔案，在根目錄下自建該目錄然後配置以下代碼：

module.exports = {
 publicPath: process.env.NODE_ENV === 'production' ? '/nakAppServer/ncpReport/' :     '/',
 outputDir: "ncpReport", // 在npm run build時 生成檔案的目錄 default:'dist'，此處定義為          ncpReport
 assetsDir: "static", // 放置生成的靜态資源 (js、css、img、fonts) 的目錄。default: ''
 indexPath: "index.html",
 lintOnSave: false,//是否需要在儲存時執行lint格式化校驗
 runtimeCompiler: true,
 productionSourceMap: false,//如果你不需要生産環境的 source map，可以将其設定為 false 以加速生産環境建構。
pages: {
// 多頁配置（單頁應用隻需要配置入口頁面，注意路徑）
  index: {
     entry: "src/index.js", // 配置入口js檔案
     template: "public/index.html", // 首頁面
     filename: "index.html", // 打包後的html檔案名稱
     title: "首頁", // 打包後的.html中<title>标簽的文本内容
           // 在這個頁面中包含的塊，預設情況下會包含
          // 提取出來的通用 chunk 和 vendor chunk。
     chunks: ['chunk-vendors', 'chunk-common', 'index']
      }
   },
   
devServer: {
// host:'接口的通路域名（背景提供給前端）',
  proxy: {
  '/api': {
    target: '接口通路的域名（背景提供給前端，同以上）', // 設定你調用的接口域名
    changeOrigin: true, // 是否跨域
    ws: true,
    pathRewrite: {
          '^/api': '/'  // 這裡可以了解為用‘/api’來代替target裡面的位址
        }
      }
    }
  },
           

注意：在封裝的axios類中，需要注意

axios.defaults.baseURL ="/api";

當釋出正式包時，将此配置為背景域名，如：

axios.defaults.baseURL ="http://test.xxxxxx.com/“;

說明：該配置在vue-cli3建立的項目中可以正常使用。