在 TypeScript 项目中使用 NodeJS fs 模块对打包成 ESM 模块的影响

在 TypeScript 项目中，确实可以同时使用 import 和 require 语句来引入第三方库。前者用于导入 ESM 模块，而后者用于导入 CJS 模块。两者之间的区别在于，ESM 模块采用 ES6 模块语法，而 CJS 模块采用 CommonJS 模块语法。

Element Plus UI Vue3

Element Plus Vue3 桌面组件库。在开发 Vue 3.x 页面时调用，使用 Element Plus 组件（如 el-button、el-input、el-form、el-table 等）。

下载

在打包项目到 dist 文件夹时，可以选择将 ESM 模块打包为 ESM 文件，也可以打包为 CJS 文件。需要注意的是，如果项目中使用了 NodeJS 的 fs 模块，并且打包为 ESM 模块，那么打包后的库将无法在前端使用（例如在 React 或 Vue 中）。

这是因为 fs 模块是 NodeJS 中的原生模块，无法直接在浏览器中使用。因此，在打包 TypeScript 项目时，如果需要在前端使用该项目，需要打包为 CJS 模块，或者提供 ESM 和 CJS 两种版本的打包产物。