vue.config.js vue-cli5 配置路径别名@和跨域proxy

2023年 3月 15日 748点热度 1人点赞 0条评论

遇到的问题

我用vue-cli5创建一个vue3项目（vue-cli默认是webpack集成），想使用路径别名@和跨域proxy。于是我去网站上各种找，最后发现如下方法。

默认vue.config.js代码

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave: false
})

解决

删除defineConfig.直接在module.exports上操作

{
  transpileDependencies: true,
  publicPath: "./",
  outputDir: "nmgsltjsd",
  configureWebpack: {
      resolve: {
          alias: {
              "@": path.resolve(__dirname, "src"),
              "@@": path.resolve(__dirname, "src/components"),
              "@assets": path.resolve(__dirname, "src/assets"),
          }
      },
      devServer: {
          proxy: {
              "/api": {
                  target: "http://你代码的服务端地址"
              }
          }
      }
  }
}