尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

【node.js】node.js 两种模块规范 CommonJS 和 ESM 如何选择?

【node.js】node.js 两种模块规范 CommonJS 和 ESM 如何选择?
📅 发布时间:2026/6/20 14:55:14

在 Node.js 的生态系统中,存在两种主要的模块规范:CommonJS (CJS)和ES Modules (ESM)。

理解它们的区别对于现代前端和后端开发至关重要,因为 Node.js 正在从 CJS 全面转向 ESM。


1. CommonJS (CJS)

CommonJS 是 Node.js 诞生的默认模块系统,已经存在了十多年。

  • 语法:使用require()导入模块,使用module.exports导出模块。
  • 加载方式:同步加载。这意味着当你调用require()时,Node.js 会阻塞后续代码的执行,直到模块加载完成。
  • 适用场景:传统 Node.js 项目、服务器端脚本。

示例代码:

// 导出 (math.js)constadd=(a,b)=>a+b;module.exports={add};// 导入 (main.js)const{add}=require('./math.js');console.log(add(2,3));

2. ES Modules (ESM)

ESM 是 JavaScript 在 2015 年(ES6)确立的标准官方模块系统,旨在让浏览器和服务器通用一套标准。

  • 语法:使用import导入,使用export导出。
  • 加载方式:异步加载。它分为三个阶段:构建(解析)、链接、求值。这种机制支持“静态分析”。
  • 适用场景:现代前端框架(Vue, React)、浏览器环境、现代 Node.js 项目。

示例代码:

// 导出 (math.js)exportconstadd=(a,b)=>a+b;// 导入 (main.js)import{add}from'./math.js';console.log(add(2,3));

3. 核心区别对比

特性CommonJS (CJS)ES Modules (ESM)
关键字require/module.exportsimport/export
加载时机运行时加载。编译时加载(静态分析)。
加载方式同步。异步。
顶层变量有__dirname,__filename。没有这些变量(需用import.meta.url模拟)。
this 指向指向当前模块。undefined。
Tree Shaking不支持(因为是动态加载)。支持(可以删除未使用的代码)。
严格模式默认不开启。强制开启(“use strict”)。

4. 关键差异深度解析

(1) 静态分析 vs 动态加载
  • ESM 是静态的:import语句必须放在文件顶部。因为它是静态的,打包工具(如 Webpack, Rollup, Vite)可以在代码运行前知道哪些代码被使用了,从而进行Tree Shaking(剔除无效代码),缩小包体积。
  • CJS 是动态的:你可以在if语句或函数内部写require()。这使得它很灵活,但也无法在编译阶段进行优化。
(2) 值的拷贝 vs 值的引用
  • CJS:导出的是值的拷贝。一旦输出一个值,模块内部的变化不会影响到已加载的值。
  • ESM:导出的是值的动态只读引用(Live Bindings)。如果模块内部修改了变量,外部引用的地方也会同步更新(但外部不能修改它)。
(3) 环境变量(__dirname)

在 CJS 中,你可以直接使用__dirname获取当前目录。在 ESM 中,这些全局变量不存在,你需要这样操作:

// ESM 获取 __dirname 的方法import{fileURLToPath}from'url';import{dirname}from'path';const__filename=fileURLToPath(import.meta.url);const__dirname=dirname(__filename);

5. 如何在 Node.js 中选择?

现在 Node.js 同时支持两者,判断规则如下:

  1. 文件名后缀:
    • .cjs总是被视为 CommonJS。
    • .mjs总是被视为 ES Modules。
    • .js取决于最近的package.json。
  2. package.json:
    • 设置"type": "module",则.js文件被视为ESM。
    • 设置"type": "commonjs"或不设置,则.js文件被视为CJS。

6. 互操作性(能不能混用?)

  • ESM 导入 CJS:可以。import cjs from './file.cjs'通常能工作,但只能默认导入,不能通过解构导入(因为 CJS 是运行时生成的)。
  • CJS 导入 ESM:不可以使用require()。因为 ESM 是异步的,而require是同步的。如果必须在 CJS 中用 ESM,只能使用异步的import()函数:
    // 在 CJS 文件中import('./esm-file.mjs').then(module=>{// 使用模块});

总结

  • 如果你正在开发新项目,建议优先使用ESM,因为它是未来的标准,且支持更好的性能优化。
  • 如果你在维护老旧项目或使用大量仅支持 CJS 的老旧库,则继续使用CommonJS。

相关新闻

  • 为什么顶尖开发者都在用Open-AutoGLM做交通查询?真相令人震惊
  • Open-AutoGLM智能购票实战指南(从零搭建高并发抢票系统)
  • 2025年PTE培训机构排行榜:羊驼PTE口碑好吗、羊驼PTE的课程价格贵吗 - 工业推荐榜

最新新闻

  • 告别复杂图表工具!用Mermaid.js轻松创建专业数据可视化的终极指南
  • 深度学习可视化:从Grad-CAM到训练监控,打开模型黑箱的完整指南
  • 【楼长修楼防水案例】青岛业主自主报修,单人房屋漏水维修全过程 - 青岛防水品牌推荐
  • CANN/ge GE图引擎API验证算子属性
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误

日新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

周新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号