vue3.0以后添加路径别名

作为一个刚学习vue的新手,踩了不少的坑,
在vue3.0以后,脚手架工具的改变让文件的目录也有了不少的修改
在之前想要添加路径别名,只需要哎webpack.base.config.js中做修改就行了,但是在vue3.0以后,发现没有这个文件了,取而代之的是vue.config.js,如果需要自定义别名,那么需要在package.json的同级目录添加vue.config.js文件,然后在里面添加以下代码

const path = require('path')

function resolve (dir) {
  return path.join(__dirname, dir)
}
// 项目的主要配置文件
module.exports = {
  // webpack 配置进行更细粒度的修改  https://cli.vuejs.org/zh/config/#chainwebpack
  chainWebpack: (config) => {
    // 修改文件引入自定义路径
    config.resolve.alias
      .set('@', resolve('src'))
      .set('style', resolve('src/assets/style'))
  }
}

然后在其他的地方引用就行了
具体的可以参考官网vue中文文档

你可能感兴趣的:(vue)