vue-cli@3.0创建项目时的配置

项目打包上线后，找不到静态文件目录

module.exports = {
  publicPath: "./",
  //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。
  assetsDir: "static",
   devServer: {
    host: "0.0.0.0",
    port: 80,
    //自动打开浏览器
    open: true,
    //代理
    // proxy: {
    //   // detail: https://cli.vuejs.org/config/#devserver-proxy
    //   [process.env.VUE_APP_BASE_API]: {
    //     target: `http://localhost:8080`,
    //     changeOrigin: true,
    //     pathRewrite: {
    //       ["^" + process.env.VUE_APP_BASE_API]: "",
    //     },
    //   },
    // },
    disableHostCheck: true,
  },
  //全局使用scss变量
   css: {
    loaderOptions: {
      scss: {
        prependData: `@import "@/assets/css/mainTheme.scss";`, //这样就可以全局使用mainTheme的变量，不用每个页面引入
      },
    },
  },
};

设置生产环境及开发环境的请求地址

创建 .env .env.development .env.production 三个根目录文件
.env

// .env
VUE_APP_CURRENTMODE='www.test.com'

.env.development
开发环境

// .env.test
VUE_APP_CURRENTMODE ='test'
 
VUE_APP_BASE_API = 'http://1.1.1.1:80099/'

.env.production
生产环境

// .env.production
VUE_APP_CURRENTMODE='production'

# 康旭设备管理平台/开发环境
VUE_APP_BASE_API = 'http://cloud.aaa.com:9650'

可以直接调用process.env.VUE_APP_BASE_API 属性
不同环境对应的process.env.NODE_ENV 分别是production development