JavaScript模块化分ES6（静态编译时解析、实时绑定）和CommonJS（动态运行时加载、值拷贝），二者不原生兼容，需工具桥接；现代前端优先ES6，Node新项目可启用ESM，npm包建议双格式发布。
JavaScript模块化是把代码拆分成独立、可复用的单元，ES6模块（import/export）和CommonJS（require/module.exports）是两种主流方案，核心区别在于设计目标、加载时机和运行环境。
ES6模块是编译时静态解析
ES6模块在代码解析阶段就确定依赖关系，不执行代码也能知道导入了什么。这意味着：
-
不能动态导入路径：比如
import './' + name + '.js'会报语法错误；需用import()动态函数替代 -
顶层
this是undefined，不是模块对象 -
绑定是实时的、只读的：导出变量被修改后，所有导入处能立即看到变化（如
export let count = 0，另一模块改它，导入方也同步更新） - 支持
export default和具名导出混用，但import语法必须匹配导出形式
CommonJS是运行时动态加载
Node.js早期采用的模块系统，依赖在代码执行到 require() 时才真正加载：
-
可以条件引入：比如
if (env === 'dev') require('./mock')合法 -
每次
require返回的是模块导出对象的拷贝（浅拷贝），后续修改不影响已导入值 -
模块缓存基于文件路径：相同路径的
require总是返回同一缓存对象，避免重复执行 -
module.exports和exports都可导出，但直接赋值exports = {...}会断开与module.exports的引用，应避免
二者不能直接互调，需工具桥接
ES6模块默认不兼容CommonJS，反之亦然。实际项目中常需转换：
立即学习“Java免费学习笔记（深入）”；
- Node.js 14+ 支持
.mjs或"type": "module"启用ES6模块，此时require()不能直接用，需用import()或createRequire兼容旧模块 - 打包工具（如Webpack、Vite）自动处理混合模块：把CommonJS转成ES6风格，或为ES6模块生成兼容的UMD/AMD包装
- 使用
export default require('xxx')可在ES6模块中导入CommonJS包（Webpack等支持），但属于工具层面的“糖”，非语言原生能力
选择建议：看环境和团队规范
现代前端开发优先用ES6模块，Node.js新项目也可启用原生ESM；CommonJS仍在大量Node库和老项目中广泛存在：
- 写浏览器端代码或使用Vite、Webpack等工具链 → 用
import/export - 写纯Node.js脚本且需兼容老版本（如Node 12以下）→ 用
require/module.exports - 发布npm包时，可同时提供
main（CommonJS）和exports（ESM）字段，兼顾不同消费者 - 避免在同一个文件里混用两种语法（如
import和require并存），易引发解析错误或行为不一致
不复杂但容易忽略：模块化不只是语法差异，更是加载机制、作用域模型和工具链协同的结果。理解本质比记住写法更重要。
