介绍
在前端开发中，我们经常需要对文件路径进行处理，尤其是在打包和引用静态资源的时候。常见的操作包括获取多个路径的公共前缀，即 common path prefix，这个工作很重复也很容易出错。为了方便开发者，npm 社区中出现了很多可以处理路径的包，其中就包括 common-path-prefix 这个 npm 包。
common-path-prefix 是一个可以求取多个文件路径的公共前缀的小工具包，适用于在 webpack 等打包工具中使用的路径提取等操作。
安装
common-path-prefix 是一个 npm 包，可以通过 npm 安装：
npm install --save-dev common-path-prefix
使用
使用 common-path-prefix 非常简单，其主要提供了一个 commonPathPrefix(paths, sep) 方法，即可以求出一组路径的公共前缀，在方法中，paths 参数是一个由路径字符串组成的数组，sep 参数是路径分割符，如果省略 sep，则使用操作系统默认分割符。
-- -------------------- ---- ------- ----- ---------------- - ----------------------------- ----- ----- - - -------------------------------------- ----------------------------------------- --------------------------------------------- -- ----- ------ - ------------------------ -------------------- -- ----------------------------
如果路径不是以分割符结束的，common-path-prefix 会在必要时自动添加分割符，因此您可以安全地跨Windows和其他操作系统。
-- -------------------- ---- ------- ----- ---------------- - ----------------------------- ----- ----- - - ------------------------------------------- ---------------------------------------------- --------------------------------------------------- -- ----- ------ - ------------------------ -------------------- -- ----------------------------
示例
下面我们来看一个实际的例子，在 webpack 中使用 common-path-prefix：
-- -------------------- ---- -------
----- ---------------- - ------------------------------
----- ---- - ----------------
-------------- - -
------ -
---- ----------------
--
------- -
----- -------------------- ---------
--------- ------------
--
------------- -
------------ -
------------ -
-------- -
----- -------------------------
----- -------- ------- -------------- -- -
----- -------------- - ------
-------------
-----------
------------------- -- ------
----- -------------- - ------
----------- -- ----------
----------
----------------- ----
----- ------ - ---------------------------------- -- ------------
------ -----------------------------------------------------------------
--
------- ------
--
--
--
--
--示例内容是 webpack 中的代码分割配置，其中我们使用了 common-path-prefix 包来解析公共前缀，从而推断共享代码分割块的名称。这样就能够使异步加载的代码块及其共享的依赖的文件名哈希稳定，从而避免无用的缓存清除，提高性能。
总结
common-path-prefix 是一个非常小巧的 npm 包，但提供了非常实用的功能，尤其适用于需要多次处理路径的情况。该包的使用简单，且有广泛的使用空间，因此掌握 common-path-prefix 的使用方法，有助于提高代码质量及开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedb776b5cbfe1ea06117b2