Vue-Cli4.x配置文件路径别名
一、目录结构

二、配置方法
提示:和package.json同级新建vue.config.js文件(可选文件,默认没有创建)。
const path = require('path');//引入path模块
function resolve(dir){
return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径
}
module.exports={
chainWebpack:(config)=>{
config.resolve.alias
.set('@',resolve('./src'))
.set('components',resolve('./src/components'))
.set('views',resolve('src/views'))
.set('assets',resolve('src/assets'))
//set第一个参数:设置的别名,第二个参数:设置的路径
}
}
Vue-Cli4.x配置文件路径别名的更多相关文章
- 【vue-cli 3.0】 vue.config.js配置 - 路径别名
如何配置vue-cli 3中vue.config.js的路径别名? 前段时间更新电脑重装了一下vue-cli,发现了vue-cli已经更新到3.0版.用来搭建项目后发现简化了很多,而且配置文件现在可以 ...
- vue项目中的路径别名
每次写引入组件的路径,如果路径嵌套比较深,那么会比较麻烦,我们可以在webpack.base.conf.js,中设置路径的别名,默认webpack设置src的别名为@ 建议配置src下一级目录的别名, ...
- vue.config.js添加路径别名
在组件库中添加配置文件后其它文件需要引用它,此时想到利用路径的别名比较方便,相当于缩写了,请看下面的添加过程: (一)在vue.config.js文件中添加的内容如粗体字体所示: const path ...
- VueCli4构建项目如何配置文件路径别名?
1.在项目文件根目录上创建 vue.config.js 文件 2.写入以下代码,具体内容见注释: const path = require('path') // 引入path模块 function r ...
- 让webstorm 识别vue cli3项目中的@路径别名
在setting -> languages&frameworks -> webpack里选择配置文件路径为 node_modules/@vue/cli-service/webpac ...
- webstorm中不能识别react、vue alias 路径别名符号
https://blog.csdn.net/weixin_37939942/article/details/89388466 因为我平时比较喜欢使用ws做开发,所以在使用vue或react的时候只要使 ...
- vue配置config ‘./.../.../***/**.vue’路径别名
cli-4的脚手架配置 因为组件的引用,经常会遇到import * from '../../../components/common/***.vue‘这样的引入格式,太复杂了,所以可以在vue里面配 ...
- 基于webpack的vue项目路径别名
在vue的项目里,我们可以使用../这样的相对路径的方式引用不同目录的组件: import userinfo from '../../../components/userinfo.vue'; 使用.. ...
- Vue之vue中的data为什么是一个函数+vue中路径别名alias设置
问题描述 为什么在vue组件中,我们的data属性必须是一个函数,new Vue()中的data除外,因为new Vue中只有一个data属性. 原因 因为我们能抽离出来的组件,肯定是具有复用性的,它 ...
随机推荐
- OGG FOR BigData(Hive) GoldenGate 性能测试
版本信息: Oracle GoldenGate Command Interpreter Version 12.2.0.1.160419 OGGCORE_12.2.0.1.0OGGBP_PLATFORM ...
- Rabbit的字符串 字符串最小表示法
Rabbit的字符串 #include<bits/stdc++.h> using namespace std; ; char s[maxn]; int get_min_pos() { , ...
- MySQL常见面试题索引、表设计
正确使用索引的条件 1.建立索引的列的重复度不能太高 2.条件列不能参与计算 3.不能使用函数 4.条件中不能使用范围 5.不要使用like '%c' 6.条件中用or a=0 or b=1 or c ...
- 干货分享:如何使用Kubernetes的Ingress API
您可以通过使用诸如Kong for Kubernetes的Ingress控制器(使用自定义资源定义并提供许多插件)来极大地扩展Ingress资源的功能. Kubernetes正在整个技术行业中得到采用 ...
- vue项目中使用bpmn-流程图json属性转xml(七篇更新完成)
内容概述 本系列“vue项目中使用bpmn-xxxx”分为七篇,均为自己使用过程中用到的实例,手工原创,目前陆续更新中.主要包括vue项目中bpmn使用实例.应用技巧.基本知识点总结和需要注意事项,具 ...
- jsp 判断时间大小
jsp 判断时间大小 <% SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); Date ...
- HTML使用正则验证
制作HTML前台用户验证等,需要对用户名或者密码进行验证,这时使用正则表达式能够精确地对text进行限制. 具体在HTML中的运用代码如下: 转自 https://blog.csdn.net/weix ...
- Maven——pom.xml文件报错:Missing artifact:jar包
原因:该错误原因为maven库中jar包无法更新 解决方法:找到maven库中对应的jar包路径,删除文件夹中的红框中的三个文件
- Flutter 使用Navigator进行局部跳转页面
老孟导读:Navigator组件使用的频率不是很高,但在一些场景下非常适用,比如局部表单多页填写.底部导航一直存在,每个tab各自导航场景. Navigator 是管理路由的控件,通常情况下直接使用N ...
- Postgre数据库自定义函数
自定函数 1.查询函数: select prosrc from pg_proc where proname='test' 参数说明 : test 为函数名. 2.删除函数: drop function ...