vue项目中 路径使用的@

最新推荐文章于 2024-01-30 15:11:49 发布
最新推荐文章于 2024-01-30 15:11:49 发布
阅读量1.3k 收藏 1
点赞数 1
分类专栏： 前端 文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44068394/article/details/105370299
版权

  1. @一般都是在路径访问中使用

  2. 我们在build/webpack.base.conf这个文件里面定义。
    在这里插入图片描述

  3. 默认定义：@这东西代表着到src这个文件夹的路径
    在这里插入图片描述

  4. 我们可以自己添加 (也可以作为一个小技巧使用) ：
    在这里插入图片描述

lanzhengdanrui
关注
专栏目录
Vue中路径的`@/`和`./`有何区别
郭宝的博客
12-24 2745
`./` 的意思：          表示的是相对路径，具体代表当前目录下的同级目录，遵从的是从后往前找文件,   `@/` 的意思：           表示的是相对路径，具体代表什么路径要看项目根目录/build/webpack.base.conf.js 文件中@是如何配置的，比如我的配置文件中@就代表src目录，遵从的是从前往后找，比如'@/components/login' 就表示...
vue中引入路径@的用法
zszcc的博客
09-14 6285
一、Vue文件中引用路径的介绍 1、路径 ./ ./当前文件同级目录 2、路径 …/ …/当前文件上一级目录 3、@符号 @ 的作用是在你引入模块时，可以使用 @ 代替 /src 目录，避免易错的相对路径。 二、Vue中使用 1. vue.config.js配置文件中使用 chainWebpack(config) { config.resolve.alias .set('@', resolve('src')) .set('assets', resolve('s
Vue项目中使用@路径
热门推荐
Good Luck
06-10 9万+
第一步：安装一下path npm install path --save 第二步：在vue.config.js文件中配置一下
vue 如何配置@绝对路径
who_become_gods的博客
02-25 1万+
第一种：直接使用@ vue项目中默认定义了@（最常用）和vue$两个别名 ， @这东西代表着到src这个文件夹的路径， 下面所属目录可以直接 @/views @/components @/store @/router @/assets ├── vue.config.js ├── package.json ├── babel.config.js ├── public └──index.html ├── src └── assets └── com
vue使用@路径引入
马优晨
06-04 2万+
vue使用@路径引入，这个在项目中很常见； 项目中使用引入文件有时候路径比较深，需要使用"../../../xx.js"这种类似的路劲引入，这种方式比较笨，可以使用webpack的别名alias配置来解决。 首先，先确定项目中是否有path模块： 如果没有path模块需要先安装path npm install path --save （1）vue-cli1，vue-cli2搭建的项目 以下为vue.config.js配置 const path = require("path"); function
vue中引入路径@的用法及说明
最新发布
weixin_42508745的博客
01-30 1013
引用 https://blog.csdn.net/weixin_44836531/article/details/131061927。
vue项目如何设置@路径提示，@代替src
你喜欢大熊猫嘛
06-13 1270
vue项目如何设置@路径提示，@代替src
Vue配置根目录@（引用路径）
明日复明日的博客
08-12 5431
首先：@是在路径访问时使用的，为了减少层级引用。 @这是webpack设置的路径别名，默认指向src。 旧版本在build/webpack.base.conf这个文件里面定义。 新版本在根目录下创建在vue.config.js定义。 const path = require('path') const resolve = dir => path.join(__dirname, dir) module.exports = { baseUrl: './', runtimeCompile
浅谈vue项目,访问路径#号的问题
10-14
Vue.js 是一个流行的前端JavaScript框架，用于构建用户界面。在Vue项目中，你可能会遇到URL中包含"#/"的情况，这与Vue Router的默认工作模式有关。...希望这些信息能帮助你更好地理解和解决Vue项目中的路径问题。
vue 路径@
qq_29236119的博客
01-14 171
1、@是webpack定义的别名，在js中可以使用，如下： import util from '@/assets/js/util' 注：import xxxxx是js语法，所以可以使用@别名 2、这个@是在webpack.base.config.js中配置的，如下： resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/胜利ue.esm.js', '@': resolve('sr
vue中引入路径用法及说明
zzy7075的专栏
03-07 2879
vue中引入路径@的用法及说明
vue配置@路径
qq_44161722的博客
10-12 855
第二步：在vue.config.js文件（如果没有就新建）中配置。第一步：安装path，如果node_module文件夹中有。
Vue项目中../路径./路径@/路径~@/路径的区别
coldriversnow的专栏
09-07 775
…/ 表示父级目录下 ./ 表示当前目录下 @/ 是webpack/build/webpack.base.conf.js中配置的路径别名 ~ @/中的 ~ 代表根目录，~@即根目录下的配置为@的路径
vue文件引入路径 ./ ../ @/ @xxx
xll0513的博客
04-13 1674
的作用是在你引入模块时，可以使用 @ 代替 /src 目录，避免易错的相对路径。(注意@不要用在引入css文件路径，有的项目规范不支持)// 在导入语句没带文件后缀时，webpack会自动按照顺序添加后缀名查找。vue在webpack.base.conf.js文件中有如下配置。// 将项目根目录中，src的路径配置为别名@例如：在路由index.js中，导入banana.vue。./当前文件同级目录， ./css/等同于css/../当前文件上一级目录。// 连接路径并返回。
「vue基础」Vue Router 使用指南上篇（文末送漂亮的 Vue 站点源码）
前端达人
10-16 306
关注前端达人，与你共同进步文末送高品质Vue站点源码，不容错过哦！大家好，今天的内容，我将和大家一起聊聊 Vue 路由相关的知识，如果你以前做过服务端相关的开发，那你一定...
Vue---在vue路径中@的使用
前端与计算机相关知识的分享，博主的qq523235674
02-19 2426
1.@表示项目文件夹src目录 'src/index.vue' 等价于 '@/index.vue' 2.如果在css代码中则需要在前面加~ 在css代码中 @import 'src/index.css'; 等价于 @import '~@/index.css';
vue路径中“@/“代表什么
wjw_de_java的博客
10-24 1016
路径中"@/"代表什么
如何在vue项目中配置引用路径“@”
m0_60692814的博客
09-11 1万+
配置引用路径（以@引用为项目的src目录为例）可拆分为如下两步操作 配置webpack打包时将@解析为项目的src目录 配置vsCode在路径中输入@时的路径提示 本贴着重讲解“配置webpack打包时将@解析为项目的src目录”的操作和溯源 操作 在项目根目录的vue.config.js文件中做如下配置 const path = require('path') module.exports = { configureWebpack: { resolve: {
简化文件、图片路径的方法，也就是vue中关于 '@/' 、 '~@/' 代表的含义
weixin_44514665的博客
06-05 6837
使用背景 在vue的项目中需要使用到 某一个路径的图片，但是用相对路径和绝对路径书写起来都会是很长的路径 例如： ./../../../static/img/my/icon4.png 甚至更长 这种情况下，想要我们的路径书写简短一点 就可以使用 ‘@/’ 、 ‘~@/’ 来表示前面部分的路径 ‘@/’ 也是相对路径 和 ‘./’ 意思差不多，具体表示什么路径需要看具体的@ 如何配置 首先需要现...
vue项目中使用绝对路径
04-26
来引入文件怎样设置？ 在vue项目中，可以在根目录下的vue.config.js文件中配置resolve属性，设置别名以及绝对路径的引入。例如： ``` const path = require('path'); module.exports = { resolve: { alias: { '@': path.resolve(__dirname, 'src'), 'components': path.resolve(__dirname, 'src/components'), 'views': path.resolve(__dirname, 'src/views') } } } ``` 然后，在vue组件中，就可以直接使用别名的方式进行文件引用，例如： ``` import ExampleComponent from '@/components/ExampleComponent.vue'; import ExampleView from 'views/ExampleView.vue'; ``` 这样就可以在vue项目中使用绝对路径来引入文件了。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值