vue_cli4的路径别名的配置

在开发vue的项目中，我们肯定需要对路径进行配置，因为在各个文件中，导入文件什么的，使用./、和 ../这种格式的相对路径，就比较的烦，要对路径的结构相当的熟悉，而且难以维护。所以我们就要去设置别名（alias）

所以需要配置一个JS文件，名字为vue.config.js，与package.json同级。

配置代码如下：

const path = require('path');//引入path模块
function resolve(dir){
    return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径
}


module.exports={
   
    chainWebpack:(config)=>{
        config.resolve.alias
        //set第一个参数：设置的别名，第二个参数：设置的路径
        .set('@',resolve('./src'))
        .set('components',resolve('./src/components'))
        .set('assets',resolve('./src/assets'))
        .set('views',resolve('./src/views'))
        .set('network',resolve('./src/network'))
        //注意 store 和 router 没必要配置
　　　　
    }
}

上面这个配置就是对vue项目的大致目录的配置，但是我的个人习惯，就只会配置第一个，使用@这个简介路径就可以了。因为这样也同样使我的结构更加的清楚，看自己的喜好吧！