在前端开发中，我们经常需要切换不同的 module 格式（AMD，CommonJS，ES Module 等）以适应不同的环境和工具链。而在使用 CommonJS 格式的项目中，我们可能会遇到一些无法直接转换为 ES module 格式的代码。这时候， @jsenv/commonjs-converter 这个 npm 包就派上用场了。
安装
npm install @jsenv/commonjs-converter
用法
转换单个文件
我们可以使用以下代码将 input.js 这个 CommonJS 格式的模块转为 ES module 格式：
-- -------------------- ---- -------
----- - --------- --------- - - ----------------------
----- - --------------------------- - - ------------------------------------
----- -------- ------------- -
----- ----- - ----- -------------------- -------
----- - ---- - - ----- ---------------------------------- -
---- ---------------------------
--
----- ---------------------- ----- -------
-
-------------转换目录
如果我们需要批量转换一个目录下所有的 CommonJS 格式模块，我们可以使用以下代码：
-- -------------------- ---- -------
----- - --- - - ----------------------
----- - ------------- - - --------------
----- - --------------------------- - - ------------------------------------
----- -------- ------------------ -
----- ----- - ----- ------------------------- -
-------------- -----
--
--- ------ ---- -- ------ -
-- ---------------- --------
-- ---------------------------- --------
----- ----- - ----- ------------------- -------
----- - ---- - - ----- ---------------------------------- -
---- ------------------------------
--
----- -------------------- ----- -------
-
-
------------------这段代码会将 /path/to/directory 目录下的所有 .js 文件转换为 ES module 格式。
转换带有依赖的模块
有些模块可能会依赖其他模块，这时候我们需要将这些模块一起转换。@jsenv/commonjs-converter 包提供了一个 convertCommonJsToEcmaModuleBundle 方法，可以将一个 CommonJS 格式的模块及其依赖一起转换为 ES module 格式：
-- -------------------- ---- -------
----- - --------- --------- - - ----------------------
----- - --------------------------------- - - ------------------------------------
----- -------- --------------- -
----- --------- - ----- -------------------- -------
----- - ---- - - ----- -------------------------------------------- -
---- ---------------------------
--
----- ---------------------- ----- -------
-
---------------这段代码会将 entry.js 这个 CommonJS 格式的模块以及其依赖一起转换为 ES module 格式。
配置项
@jsenv/commonjs-converter 包提供了一些可选的配置项，以更好地适应不同情况：
"url"（string）：指定转换后的代码的import.meta.url，默认为about:blank。"sourceMap"（boolean）：是否生成 source map，默认为false。"sourceMapFilename"（string）：指定生成的 source map 文件名，默认为<output-file>.map。
总结
在前端开发中，@jsenv/commonjs-converter 包提供了一种便利、高效的方式，可以帮助我们快速将 CommonJS 格式的模块转换为 ES module 格式，以便更好地适应不同的环境和工具链。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f29ed243b0ab45f74a8babe