vue-cli4配置别名

        风格

         先在项目中创建一个文件 vue.config.js 文件名是固定的，不可更改。文件必须与 src 文件在同意目录下。如下图所示：

         之后就可以在里面写入配置别名的代码

// 引入path模块
const path = require('path');
function resolve(dir) {
    // join(__dirname) 设置绝对路径。 dirname代表当前所在文件路径
    return path.join(__dirname, dir);
}

module.exports = {
    chainWebpack:(config) => {
        config.resolve.alias
            .set('@', resolve('src'))
            .set('assets', resolve('src/assets'))
            .set('common', resolve('src/common'))
            .set('components', resolve('src/components'))
            .set('network', resolve('src/network'))
            .set('views', resolve('src/views'))
    }
}

 

        这一串代码就是相当于

config.resolve.alias.set('@', resolve('src')).set('assets', resolve('src/assets'))

 只是像上面第一种那样写，更舒服些。

        还有一点就是，要记得引入 path 模块，要安装进去，因为代码的第一行就是要引入 path 模块，如果没有安装，就会报错，同样配置不成功，网上很多地方都没说这个，导致我也配置了很久。

npm  install  path  --save