问题描述

在 vue.config.js 文件 中使用  webpack 配置别名 ，npm run serve运行项目出错，报错如下

错误原因

vue-cli4 别名设置写法变了。需要重写代码

之前的配置

module.exports={
    configurewebpack:{
        resolve:{
        	alias:{
        		'assets':'@/assets',
        		'common':'@/common',
        		'components':'@/components',
        		'views':'@/views',
        		'network':'@/network'
        	}
        }
    }
}

解决方法

const resolve = dir => require('path').join(__dirname, dir)
module.exports = {

  chainWebpack:(config)=>{
    config.resolve.alias
      //set第一个参数：设置的别名，第二个参数：设置的路径
      .set('@',resolve('./src'))
      .set('assets',resolve('.src/assets'))
      .set('components',resolve('./src/components'))
      .set('utils',resolve('src/utils'))
      .set('views',resolve('src/views'))
      .set('network',resolve('src/network'))
    },
}

重新运行项目后，错误解决

文章如有错误，恳请大家提出问题，本人不胜感激 。 不懂的地方可以评论，我都会 一 一 回复

文章对大家有帮助的话，希望大家能动手点赞鼓励，大家未来一起努力     长路漫漫，道阻且长