你知道path.join和path.resolve区别吗？

前言

Hi 大家好，我是蛙人，今天来更新一篇水水水文。

相信小伙伴们都对这两个方法path.join、path.resolve不陌生，在我们写node或者配置webpack的时候都用过该方法。比如下面这段：

output: {
   path: Path.join(__dirname, "dist"),
   filename: "[name]_[chunkhash:8].js"
}

但是你知道这两个的区别吗。今天笔者就来讲一下二者区别及用法。

先说一下，path为我们node中的一个内置模块，这两个方法都是path模块下提供的。

Path.resolve

不废话，先上图。我们可以看到resolve方法接收无限的参数且都是string类型的，该方法返回值也是string类型的(是一个路径)。

栗子：

// 这里我们就当__dirname是 /root

path.resolve(__dirname, "./dist") // 输出：/root/dist

path.resolve(__dirname, "dist", "dir") // 输出：/root/dist/dir

path.resolve(__dirname, "/dist") // 输出：/dist

path.resolve(__dirname, "/dist", "../") // 输出：你的磁盘根目录

path.resolve(__dirname, "/dist", "..") // 输出：你的磁盘根目录

path.resolve(__dirname, "/dist", "..", "/test") // 输出：/test

path.resolve(__dirname, "dist", "dir", "/test") // 输出：/test

path.resolve(__dirname, "dist", null, "/test") // 输出：报错，参数一定要字符串类型的！

通过上面栗子我们可以看到，参数可以任意，返回值是一个路径(string类型)。然而上面的结果是当我们的参数里面遇见/就是根路径的时候，这时返回值路径会发生极大改变，变化为：以最后一次出现/根路径的值为当前路径的开始。

Path.join

join方法跟resolve方法一样，接收无限的参数，返回值也是string类型。join顾名思义就是拼接意思。我们来看一下join的用法吧

栗子：

// 这里我们就当__dirname是 /root

path.join(__dirname, "dist") // 输出：/root/dist

path.join(__dirname, "dist", "/dir") // 输出：/root/dist/dir

path.join(__dirname, "dist", "/dir", "..") // 输出：/root/dist

path.join(__dirname, "dist", "/dir", "../test") // 输出：/root/dist/test

path.join(__dirname, "dist", "/dir", "/..test") // 输出：/root/dist/dir/..test

path.join(__dirname, "/dist", "..") // 输出：/root

通过上面栗子我们可以看到join方法只是拼接路径，也不会像resolve那样遇见/根就直接把整个路径替换跳，而只有在标准的..、../相对路径的时候跳出目录。

二者区别

通过上面的两个栗子，我相信你可以总结出二者的区别在哪里了。说白了就是resolve方法是对根路径的而直接变化的，而join方法只会将所有参数拼接，最后形成一个完整的路径(当然遇见..or../会跳出当前目录)。

这个在实际开发中配置还是用到的地方很多的，有时候我们写字符串../src/index.html不生效时，就可以试试resove or join哦。

完！就分享到这吧，希望可以对大家涨一点小知识，如有帮助请帮该文章点个赞和在看吧，让更多的人看到

感谢

谢谢阅读，如有帮助请点个关注、收藏吧

觉得有帮助可以关注 前端娱乐圈 公众号，每天为你推送一篇小知识

大家也可以加我 微信 交个朋友，可以找我聊天或拉你进技术交流群