vue2 配置路径别名和跨域

基本情况

如果使用手脚架构建的项目，一般情况下，在vue.config.js文件中看到的格式如下：

const { defineConfig } =require('@vue/cli-service')

module.exports=defineConfig({
    transpileDependencies:true,
    lintOnSave:false
})

方案1

去掉defineConfig，直接写配置。

const path=require("path")
module.exports={
    transpileDependencies:true,
    lintOnSave:false,
    configureWebpack:{
        resolve:{
            alias:{
                "@":path.resolve(__dirname,"src")
            }
        }，
        devServer:{
            proxy:{
                "/api":{
                    target:"http://yourUri"
                }
            }
        }
    }
}

方案2（推荐）

也可以直接在defineConfig中定义，好处在于不会丢失默认配置。

const { defineConfig } =require('@vue/cli-service')
const path = require("path")
module.exports=defineConfig({
    transpileDependencies:true,
    lintOnSave:false,
        configureWebpack:{
        resolve:{
            alias:{
                "@":path.resolve(__dirname,"src")
            }
        }，
        devServer:{
            proxy:{
                "/api":{
                    target:"http://yourUri"
                }
            }
        }
    }
})