vue-cli3学习之-vue.config.js配置

在你创建的项目根目录中创建vue.config.js文件
这个就是你要在axios中配置的代理地址。
devServer一块的配置可以参考 https://cli.vuejs.org/zh/config/#css-loaderoptions

proxy: { 
  "/api": {
    target: 'http://192.168.43.143:8080',
    ws: true,
    pathRewrite: {'^/api' : ''},
    changeOrigin: true
  }
}

以下是我新建的一个项目的基本代码，如果有不同需求请自行更改

module.exports = {
  publicPath: process.env.NODE_ENV === "production" ? "./" : "./", //基本路径
  outputDir: "dist", //输出文件目录
  lintOnSave: true, // eslint-loader 是否在保存的时候检查
  assetsDir: 'assets', //放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。
  pages: undefined, //以多页模式构建应用程序。
  runtimeCompiler: false, //是否使用包含运行时编译器的 Vue 构建版本
  parallel: require('os').cpus().length > 1, //是否为 Babel 或 TypeScript 使用 thread-loader。该选项在系统的 CPU 有多于一个内核时自动启用，仅作用于生产构建，在适当的时候开启几个子进程去并发的执行压缩
  transpileDependencies: [],
  productionSourceMap: false, //生产环境是否生成 sourceMap 文件，一般情况不建议打开
  chainWebpack: config => {
    // 修复HMR
    config.resolve.symlinks(true);
    },
  configureWebpack: () => {},
  devServer: {
    open: true, //配置自动启动浏览器
    disableHostCheck: true, // 禁用webpack热重载检查 解决热更新失效问题
    host: "localhost",
    port: 8088,
    https: false,
    hotOnly: true, // 热更新
    proxy: { //配置自动启动浏览器
      "/api": {
        target: 'http://192.168.43.143:8080',
        ws: true,
        pathRewrite: {'^/api' : ''},
        changeOrigin: true
      }
    }
    // before: app => {}
  },
  css: {
    modules: false, // 启用 CSS modules
    //extract: true, // 是否使用css分离插件
    sourceMap: false, // 开启 CSS source maps，一般不建议开启
    loaderOptions: { // css预设器配置项
      sass: {
        data: `
          @import "@/assets/css/variable.scss";
          @import "@/assets/css/base.scss";
          @import "@/assets/css/mixin.scss";
          @import "@/assets/css/styleElement.scss";
        `
      }
    }
  },
  // parallel: require("os").cpus().length > 1, // 是否为 Babel 或 TypeScript 使用 thread-loader
  pwa: {}, // 向 PWA 插件传递选项
  pluginOptions: {} // 第三方插件配置
}