添加别名

新建一个vue.config.js的文件夹，开始可配置vue-cli

1 别名配置

javascript

const path =  require('path'); //引入path模块（node）
const resolve = (dir) => path.join(__dirname, dir); //将文件组成绝对路径
 
module.exports = {
    chainWebpack: config => {
        // 添加别名
        config.resolve.alias
          .set('@', resolve('src'))
          .set('assets', resolve('src/assets'))
          .set('components', resolve('src/components'))
    }
}

1
2
3
4
5
6
7
8
9
10
11
12

2 运用场景

目录的结构可能层层叠叠，后在达到目录

例如: 刚刚的env.js目录

javascript

import {baseUrl} from '../config/env'

但是我们不一定保证，目录就那么靠近，那么怎么处理

javascript

// @代表src目录下，即可这样调用

import {baseUrl} from '@/config/env'

1
2
3

添加别名 #

1 别名配置 #

2 运用场景 #

添加别名

1 别名配置

2 运用场景