一.基本概念

相对路径从名字可以看出是以某一个文件夹或者文件为参照点来看,其他文件夹或者文件的路径

绝对路径即是绝对的路径,固定死的路径,则是以根目录为起始点某一文件的路径,我们平时在电脑上的文件在硬盘上真正存在的路径就是绝对路径

resources相对路径和绝对路径 相对路径与绝对路径_绝对路径

比如根目录为A,A下面有B、C两个子文件夹,B文件夹下有D文件,C文件夹下有E文件,则对于D文件来说,E文件的绝对路径就是A:\C\E,E文件的相对路径则是../C/E;因为D和E都是在根目录A下面,但其上面都还有一个父文件夹,所以前面加个..表示上一层。如图所示

resources相对路径和绝对路径 相对路径与绝对路径_相对路径_02

二.联系和区别

从上面例子我们可以看出如果将绝对路径转化为相对路径,则只需保留两者路径不同的部分,去除相同的部分即可,并且两者的分隔符有所却别,在相对路径中可以使用“/”字符作为目录的分隔字符,而在绝对路径中即可以使用“\”也可以 “/”字符作为目录的分隔字符

在相对目录中经常使用.代表的是当前所在的目录,使用..代表上一层目录,而/代表根目录

比如,我的前端项目结构如下

resources相对路径和绝对路径 相对路径与绝对路径_根目录_03

如果我需要在Dangfengjianse.vue项目中引用assets文件夹下的bgm.png图片,因为Dangfengjianse.vue和bgm.png都同在src文件夹下,则引用的相对路径格式为

resources相对路径和绝对路径 相对路径与绝对路径_根目录_04

而绝对路径则是

resources相对路径和绝对路径 相对路径与绝对路径_相对路径_05

文件的绝对路径使用VSCode可以右键该文件,然后选择复制路径即可以得到绝对路径

resources相对路径和绝对路径 相对路径与绝对路径_resources相对路径和绝对路径_06

三.总结

相对路径和绝对路径的使用没有绝对的要求使用环境,但是相对路径的使用更加灵活,方便更改,但如果相对路径可能有点难找,如果找的不对则容易出错;而绝对路径的话能避免这个问题,直接复制在硬盘上的路径即可,但是在使用上面的灵活性不如相对路径。