路径理解

[yongheng2016]

相对路径：

• 以当前文件所在目录为基准
• ./xxx 当前路径下的xxx文件，等同于直接写xxx
• ../yyy上级目录下的yyy文件
• file/zzz下级目录file文件夹下的zzz文件，注意区分/file/yyy:表示根目录下的file文件夹下的zzz文件

绝对路径

• C:/a/b/c
• http://localhost:80/file

根目录

• /file/zzz

• client 端：/代表当前服务器的主机地址：http://localhost:80/ 多用于重定向
• server端：/代表web引用的http://localhost:8080/webapp/ 此时的/就表示server端下的webapp目录

适用根目录和绝对

• 优点：路径表示简单，都是从网站的最开始目录层级查找
• 缺点：程序不容易移植（如把该网站作为另一个网站的栏目，移动到一个新的文件夹中无法正确查找）

base路径

可以作为当前html文档的基准路径 base(MDN)

参考：https://github.com/muwenzi/Program-Blog/issues/58

---

node.中的路径

__dirname

• 当前文件所在的绝对路径

path.resolve('xx', 'xx', 'xx')

• 最后拼接出来的一定时绝对路径
• 拼接顺序从左至右
• 但发现/xx时，直接拼接至根路径下，也就意味着它左边的片段都不用拼接了
• 如果整个拼接片段中都没有/，则最后拼接文件所在目录，完成根路径

参考：http://nodejs.cn/api/path.html

path.join('xx', 'xx', 'xx')

• 最后拼接出一个路径片段，也就是相对路径片段
• 和path.resolve()不同，/可有可无

---

webpack中的路径

context

• context 是 webpack 编译时的基础目录，入口起点（entry）会相对于此目录查找。
• 若不配置，默认值为当前目录，webpack设置 context 默认值代码：

this.set("context", process.cwd());    //process.cwd()即webpack运行所在的目录（等同package.json所在目录）。

参考：https://juejin.im/entry/58cf8df30ce4630057d9799e