Vue 设置自定义便捷路径

vue2.+

进入build/webpack.base.conf.js文件

1、找到resolve
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      //配置快捷路径，styles为路径名字，resolve是原路径地址
      'styles': resolve('src/assets/styles'),
    }
  },
2、设置好以后新启动项目
3、快捷路径使用举例
@import ('~styles/variables.styl'); //style文件
mport 'styles/variables.styl'  //js文件使用

vue3.+

准备工作：在根目录创建vue.config.js，添加代码

let path = require('path')
function resolve (dir) {
  return path.join(__dirname, dir)
}
module.exports = {
  chainWebpack: config => {
    config.resolve.alias
      .set('styles', resolve('src/assets/styles'))
     //配置快捷路径，styles为路径名字，resolve是原路径地址
  }
}