作为前端小白,最近在使用vue脚手架的时候,经常会遇到各种文件的引用。由于以前没有特别注意过这类问题,这次就写个文档给自己参考

PS:本篇文章仅用于 js 与 vue 代码的文件路径,其他语言的路径写法请自行尝试








假如现在有这样一个文档
a文件夹里包含b1文件夹和b2文件夹还有c、d、e文件
b1文件夹里包含f、j、h文件
b2文件夹里包含c1、c2文件
如下图:

在这里插入图片描述



1. “ . / ”

指的是同级文件,后面可以跟同一文件目录下的文件

例如:
在c文件内写:

"./d" 或 "./e" 

指向的就是同级下的 d文件 或 e文件

在c1文件内写:

"./c2"

指向的就是同级下的c2文件




2. “ . . / ”

指的是上一级文件,也可以称为父文件,后面可以跟父文件目录下的文件

例如:
在 c1文件内写:

"../d" 或 "../e" 

指向的就是上一级文件目录下的 d文件 或 e文件,
同理,在b1文件夹下的 f 文件内写这两个路径,也是指向 d文件 或 e文件




3. “ @ / ”

指的是根文件目录,后面可以跟其目录下的文件

这个我只有在vue脚手架 中才有见到。网上查阅后得知,这个根文件目录好像不是固定的,可以手动设置。但我通过那个人的方法并没有找到我的根文件目录,可能因为我们的脚手架版本不同吧(我用的是3.12.1版本),有疑问可以去百度
在这里我就贴上我见到的例子吧

在这里插入图片描述
右侧第十行,引入HelloWorld,路径用到 “ @ / ”,这里的根文件目录指向的就是 src 文件夹。所以我在其他的文件里写路径也可以直接用 “ @ / ” 来从 src 文件夹往下找,还算是比较方便。

Logo

前往低代码交流专区

更多推荐