几种vue.config.js之路径别名配置

1.第一种

module.exports = {
    //修改文件路径
    //publicPath:process.env.NODE_ENV === 'production'?'./':'/',
     publicPath: './',
    //声明配置webpack
    configureWebpack: {
      resolve: {
        //配置路径别名
        alias: {
          'assets': '@/assets',
          'common': '@/common',
          'components': '@/components',
          'network': '@/network',
          'views': '@/views',
        }
      }
    }
  }

2.第二种

const path = require('path')
function resolve(dir) {
  return path.join(__dirname, dir)// path.join(__dirname)设置绝对路径
}
module.exports = {
  devServer: {
    open: true // 自动开启项目
  },
  // 别名的配置
  chainWebpack: (config) => {
    config.resolve.alias
      .set('@', resolve('./src'))
      .set('components', resolve('./src/components'))
      .set('views', resolve('./src/views'))
      .set('assets', resolve('./src/assets'))
      .set('styles', resolve('./src/styles'))
      .set('api', resolve('./src/api'))
  }
}