vue项目 路径添加别名

1. 在vue.config.js文件中引入路径

const path = require('path')

 

2. 添加相关函数

function resolve (dir) {
  return path.join(__dirname, dir) // path.join(__dirname)设置绝对路径
}

 

3. 使用chainWebpack做高级设置

chainWebpack: config => {
    // 添加别名
    config.resolve.alias
      .set('@', resolve('src'))
      .set('assets', resolve('src/assets'))
      .set('store', resolve('src/store'))
      .set('components', resolve('src/components'))
      .set('views', resolve('src/views'))
      .set('api', resolve('src/api'))
      .set('utils', resolve('src/utils'))
      .set('model', resolve('src/model'))
      .set('config', resolve('src/config'))
    if (process.env.NODE_ENV !== 'production') {
      config.output.chunkFilename(`[name].[chunkhash:8].js`)
      config.output.filename(`[name].[hash].js`)
    }
  }