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`)
    }
  }