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属性. 原因 因为我们能抽离出来的组件,肯定是具有复用性的,它 ...
随机推荐
- python基础学习笔记(纸质)
大一的时候学的python做的笔记.
- 【雕爷学编程】Arduino动手做(64)---RGB全彩LED模块
37款传感器与执行器的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止这37种的.鉴于本人手头积累了一些传感器和执行器模块,依照实践出真知(一定要动手做)的理念,以学习和交流为 ...
- Bootstrap组件的使用
五.常用组件 总结: boot中事件,关注两件事 1.事件是如何触发的.自定义属性触发,触发方式是这个属性的值 2.事件触发的目标 button绑定目标 data-target="#id&q ...
- React的第二种使用方法----脚手架方式
一.React的第二种使用方法-----脚手架 1.前提:Node.js >8.10 2.下载全局脚手架工具 npm i -g create-react-app 3.运行全局脚手架工具,创 ...
- matlab第六章数据分析与多项式计算
MATLAB练习 第六章数据分析与多项式计算 1.max和min 1.分别求矩阵A中各列和各行元素中的最大值.max和min的用法一样 % [例6.1]分别求矩阵中各列和各行元素中的最大值. A=[5 ...
- django 中CBV和FBV 路由写法的区别
使用视图函数时, FBV: django完成URL解析之后,会直接把request对象以及URL解析器捕获的参数(比如re_path中正则表达捕获的位置参数或关键字参数)丢给视图函数 CBV: 这些参 ...
- 高版本Jenkins关闭跨站请求伪造保护(CSRF)
前言 根据官网描述,Jenkins版本自2.204.6以来的重大变更有:删除禁用 CSRF 保护的功能. 从较旧版本的 Jenkins 升级的实例将启用 CSRF 保护和设置默认的发行者,如果之前被禁 ...
- 玩转Nginx location配置
原文链接:https://mp.weixin.qq.com/s/kaEtfmX9bVdKfCVY6gbOsQ 建议点击原文链接查看 nginx是一个跨平台的web服务器, 基于事件驱动的架构并发处理百 ...
- 7.SortSet排序集合类型操作
Sort Set排序集合类型 (1)介绍 和set一样sorted set也是string类型元素的集合,不同的是每个元素都会关联一个权.通过权值可以有序的获取集合中的元素 该Sort Set类型适合 ...
- eatwhatApp开发实战(五)
上次我们为eatwhat添加了了删除功能和dialog对话框的介绍,今天我们来使用SQLite进行本地数据存储. 首先,我们定义一个SQL辅助类ShopInfoOpenHelper继承SQLiteOp ...