在前端开发中，随着 JavaScript 代码量逐渐增长，打包工具的作用变得越来越重要。而在打包过程中，把 CommonJS 模块转化成 ES6 模块是一个必要的步骤。这就是 rollup-plugin-cjs-es 的用处，它是一款转化 CommonJS 模块的 Rollup 插件。
本文将介绍 rollup-plugin-cjs-es 的使用方法，包括安装、配置、示例代码等。
安装
使用 npm 安装 rollup-plugin-cjs-es：
npm install -D rollup-plugin-cjs-es
配置
在 Rollup 配置文件中，需要先引入 rollup-plugin-cjs-es 插件：
const cjs = require('rollup-plugin-cjs-es');
然后，在 plugins 中加入该插件并设置参数：
plugins: [
cjs({
nested: true, // 是否递归转化，可选，默认值 false
include: 'node_modules/**', // 需要转化的模块位置，可选，默认值 node_modules/**
exclude: [], // 不需要转化的模块位置，可选，默认值 []
sourcemap: true // 是否生成 source map 的同时也生成对应的 .map 文件，可选，默认值 true
})
]示例代码
在 Rollup 配置中，假设有以下代码：
-- -------------------- ---- -------
------ -------- ---- --------------------------
------ ------- ---- ------------------------------
------ ------- -
------ ---------------
------- -
----- -----------------
------- ------
--
-------- -
---------
-------- ----
---
-----------
--
--加入 rollup-plugin-cjs-es 插件后，如下：
-- -------------------- ---- -------
------ -------- ---- --------------------------
------ ------- ---- ------------------------------
------ --- ---- -----------------------
------ ------- -
------ ---------------
------- -
----- -----------------
------- ------
--
-------- -
---------
-------- ----
---
-----------
-----
--
--运行 Rollup 打包后，就可以顺利地将 CommonJS 模块转化成 ES6 模块了。
指导意义
rollup-plugin-cjs-es 的出现，使得打包 CommonJS 模块变得更加方便。同时，在实际开发中，该插件还能解决一些模块转化的问题，如将 React Native 中的模块转化成 WEB 中的模块。
需要注意的是，有一些模块是不支持被转化为 ES6 模块的，因此需要在 exclude 中做好排除。
最后，rollup-plugin-cjs-es 同样支持递归转化，这能够帮助开发者处理嵌套在某些 CommonJS 模块里的依赖关系。
总之，rollup-plugin-cjs-es 在解决打包时的一些问题上有着很好的应用，值得更多开发者掌握和使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/79694