乐趣区

关于vue.js:vue中配置为src目录

vue 中配置 @为 src 目录

1. 开发环境 vue.js
2. 电脑系统 windows10 专业版
3. 在应用 vue 开发的过程中, 咱们常常会引入文件, 通过咱们都会应用相对路径 中 ../ , 这样的形式引入对应的文件, 然而一旦文件构造产生了变动, 这种形式就是一个坑, 往往会呈现找不到文件的状况。解决办法: 在 vue.config.js 中进行配置, 把 @符号配置为 src, 这样的话, 咱们再次引入文件的话, 就是 @/api 这种模式, 这样不管怎么变, 都不会呈现找不到文件的状况。
4. 在 vue.config.js 中增加如下代码:

const path=require('path');  
function resolve (dir) {path.join(__dirname, dir);  
}  
module.exports = {   
 chainWebpack: config => {config.resolve.alias.set('@', resolve('src'))  
    },  
 configureWebpack: {  
        resolve: {extensions: ['js', 'vue'],  
 alias: {'@': resolve('src')  
            }  
        }  
    }  
}

5. 以上配置实现了, 在 vue 组件中引入形式如下:

import {chen} from '@/api/Login/Login'

6. 本期的教程到了这里就完结啦, 是不是很棒, 是不是很 nice, 让咱们一起致力走向巅峰!

退出移动版