VueCLI 路径别名

在Vue CLI2 中，

参考视频：https://www.bilibili.com/video/BV1fv411C72r?p=141

webpack.base.config.js，module.exports = {
...
resolve: {
alias: {
// 起别名
'@': resolve('src'), // src目录以后可以使用@代替
'components': resolve('src/components'),
'assets': resolve('src/assets'),
'views': resolve('src/views')
}
}
...
}

在ES6语法import时，可以直接使用以上别名，在img src属性中，需要在前面加波浪号~，否则报错找不到目标文件

————————————————————————————————————————————————————————————————————————————————————————————2021-09-15 更新：

在Vue CLI3 中，新建一个vue.config.js文件，在里面添加：

module.exports = {
  configureWebpack: {
    resolve: {
      alias: {
        'components': '@/components',
        ...
        ...
      }
    }
  }
};