Javascript 中的 CJS、AMD、UMD 和 ESM 是什么？
发布时间：2025-11-05 11:59:24 来源：创站工坊 作者：人工智能
一开始，Javascript 没有办法导入/导出模块。这是个问题。想象一下，在一个文件中编写您的应用程序 - 这将是一场噩梦!
然后，比我聪明得多的人试图为 Javascript 添加模块化。其中一些是CJS、AMD、UMD 和 ESM。您可能听说过其中一些(还有其他方法，但这些是大玩家)。
我将介绍高级信息：语法、目的和基本行为。我的目标是帮助读者在看到它们时认出。
CJS
CJS 是 CommonJS 的缩写。这是它的样子：
//importing const doSomething = require(./doSomething.js); //exporting module.exports = function doSomething(n) { // do something } 你们中的一些人可能会立即从 node.js 中识别出 CJS 语法。那是因为 node使用 CJS 模块格式。 CJS 同步导入模块。亿华云 可以从库node_modules或本地目录导入。无论是通过const myLocalModule = require(./some/local/file.js)还是 var React = require(react); 都可以。 当 CJS 导入时，它会给你一个导入对象的副本。 CJS 在浏览器中不起作用。它必须被转译和打包。AMD
AMD 代表异步模块定义。这是一个示例代码：
define([dep1, dep2], function (dep1, dep2) { //Define the module value by returning a value. return function () {}; });要么
// "simplified CommonJS wrapping" https://requirejs.org/docs/whyamd.html define(function (require) { var dep1 = require(dep1), dep2 = require(dep2); return function () {}; }); AMD 异步导入模块(因此得名)。 AMD 是为前端设计的(当它被提出时)(而 CJS 后端)。 AMD 语法不如 CJS 直观。我认为 AMD 是 CJS 的完全相反的兄弟。UMD
UMD 代表通用模块定义。这是它的样子(来源)：
(function (root, factory) { if (typeof define === "function" && define.amd) { define(["jquery", "underscore"], factory); } else if (typeof exports === "object") { module.exports = factory(require("jquery"), require("underscore")); } else { root.Requester = factory(root.$, root._); } }(this, function ($, _) { // this is where I defined my module implementation var Requester = { // ... }; return Requester; })); 适用于前端和后端(因此得名Universal)。 与 CJS 或 AMD 不同，UMD 更像是一种配置多个模块系统的模式。 UMD 通常在使用 Rollup/Webpack 等打包器时用作回退模块ESM
ESM 代表 ES 模块。实现标准模块系统是 Javascript 的建议。站群服务器相信很多人都看过这个：
import React from react;其他情况
import {foo, bar} from ./myLib; ... export default function() { // your Function }; export const function1() {...}; export const function2() {...}; 适用于许多现代浏览器 它兼具两全其美：类似 CJS 的简单语法和 AMD 的异步 Tree-shakeable，由于 ES6 的静态模块结构 ESM 允许像 Rollup 这样的打包器删除不必要的代码，允许站点发送更少的代码以获得更快的加载。可以在 HTML 中调用，只需执行以下操作：
<script type="module"> import {func1} from my-lib; func1(); </script>这可能无法在所有浏览器中 100% 工作。
概括
ESM 是最好的模块格管理式，这要归功于其简单的语法、异步性质和 tree-shakeability。 UMD 随处可用，通常用作 ESM 不起作用时的后备方案 CJS 是同步的，有利于后端。 AMD 是异步的，适合前端。感谢阅读。
本文由闻数起舞翻译自Igor Irianto的文章《What Are CJS, AMD, UMD, and ESM in Javascript?》，转载请注明出处，源码下载原文链接：
https://irian.to/blogs/what-are-cjs-amd-umd-and-esm-in-javascript/
【责任编辑：赵宁宁 TEL：（010）68476606】
- 上一篇：探索Latitude系列（发现Latitude系列笔记本电脑的出色特性与优势）
- 下一篇：inux/Ubuntu系统用的时间久了，经常会有一些系统更新，除了一些系统补丁、工具补丁、工具升级之外，内核也经常对一些问题进行修改升级，这样就会产生一些新的内核，我们更新了新的内核后，就会自动帮我们添加到开机启动菜单选项中，那些旧的内核启动项，对于我们来说已经没有用了，可以删除，删除后可以让我们在开机的时候能快速的选择要启动的菜单项，同时也能清理出一些磁盘空间出来，小编下面就来分享如何删除多余的内核启动菜单项注意：小编的这个建议只适合于10.10之前版本的ubuntu系统，后面的11.04，11.10。。。14.04系统因为采用的默认桌面不同，所以本经验不适用，若要使用，那么请安装GNOME桌面 1、打开“应用程序”，然后在弹出菜单中点击“附件”，选择并打开“终端”，打开终端命令窗口2、在终端命令窗口中输入并执行下面的命令：uname -a，查看我们当前使用的内核，不要删除错误了，或者当我们使用的是旧内核进入系统，想删除这个内核启动项，这样也是不能删除的。只能在开机时选择别的内核启动项进入系统才能删除3、输入下面的命令，查看当前我们系统中有哪些内核启动项，同时也可以方便我们复制的操作，具体命令是：dpkg --get-selections | grep linux4、下面就开始删除内核启动项，先选择内核启动项，然后复制，这样方便操作，然后输入下面的命令：sudo apt-get remove linux-image-2.6.32.21-generic5、执行过程中会警告我们确实要执行这个操作，输入字母y,然后回车，就开始卸载旧内核了6、之后就是一些具体的卸载过程的提示，已经更新系统启动项的信息7、我们再次使用命令：dpkg --get-selections | grep linux 来查看当前的内核情况：在 linux-image-2.6.32.21-generic 后面显示deinstall，表示已经卸载了linux-headers-2.6.32.21和 linux-headers-2.6.32.21-generic是之前我们卸载的内核相关联的头文件，现在对于我们也没有用，也可以卸载了，卸载了可以帮我们清理出不少磁盘空间，具体命令是：sudo apt-get remove linux-headers-2.6.32-21sudo apt-get remove linux-headers-2.6.32-21-generic8、删除完后，再用命令：dpkg --get-selections | grep linux 查看当前内核启动选项相关信息:linux-headers-2.6.32-21 已经没有了，被删除了linux-headers-2.6.32-21-generic已经没有了，被删除了linux-image-2.6.32-21-generic 显示为deinstall，表示被卸载删除了9、 虽然在卸载旧内核的时候提示信息说已经帮我们更新了系统启动项，但为了保险起见我们执行sudo update-grub更新开机启动控制文件。
- 大多数的 Linux Distro 也将 IPv6 (Internet Protocol Version 6) 预设地开启，但有时实际上不需要 IPv6 支援，如要关闭 IPv6 可用以下方法: Debian / Ubuntu 1. 开启 /etc/modprobe.d/aliases 2. 里面有一行是 “alias net-pf-10 ipv6″ 3. 将以上一行用以下两行取代: alias net-pf-10 off alias ipv6 off Red Hat 1. 开启 /etc/modprobe.conf 2. 加入这一行: alias net-pf-10 off 更改以上档案后重新启动系统，这时 IPv6 便会关闭。我在 Ubuntu 上关闭了 IPv6 后，发觉 DNS 的效能改善了，那就是一般上网时要 resolve ip 时回应得更快。
- Window平台下安装MongoDB
- VirusTotal发现恶意软件攻击中常用的伪装软件
- 神经学家使用大数据工具分析大脑细胞活动
- 1. 下载Sublime Text 2在官网下载对应系统位数的版本，从压缩包中提取出源代码，解压后文件夹中的sublime_text双击即可直接运行。2. 建立快捷链接将整个文件夹Sublime拷贝到 /opt 目录下，然后打开终端输入以下命令为sublime_text建立链接：复制代码代码如下:复制代码代码如下:复制代码代码如下:复制代码代码如下:复制代码代码如下:import urllib2,os;pf=Package Control.sublime-package;ipp=sublime.installed_packages_path();os.makedirs(ipp) if not os.path.exists(ipp) else None;open(os.path.join(ipp,pf),wb).write(urllib2.urlopen(http://sublime.wbond.net/+pf.replace( ,%20)).read())重启Sublime Text 2，假如在Perferences->package settings中看到package control这一项，则安装成功。6. 使用Package Control安装插件按下Ctrl+Shift+P调出命令面板，输入install 调出 Install Package 选项并回车，然后在列表中选中要安装的插件。
- 黑客事件频发 如何保护好自己的钱包和NFT资产？
- HBase看上去很美 我的项目失败之路
- 速来领取！《软件供应链安全治理与运营白皮书（2022）》正式发布
- 昂达H61N性能全面解析（探索昂达H61N的特点与优势）
- 如何利用HTML5与MongoDB创建位置感知Web应用程序
企商汇源码下载亿华云IT技术网益华科技香港云服务器源码库服务器租用IT资讯网亿华云编程之道多维IT资讯益强IT技术网智能时代益强资讯优选亿华灵动亿华智造云站无忧益强科技益华科技益强智未来极客编程益强智囊团运维纵横益强编程舍汇智坊IT资讯网码力社技术快报全栈开发思维库亿华智慧云益强数据堂码上建站益华科技益华IT技术论坛亿华互联创站工坊益强科技科技前瞻益强编程堂极客码头益强前沿资讯
- Copyright © 2025 Powered by Javascript 中的 CJS、AMD、UMD 和 ESM 是什么？,创站工坊 滇ICP备2023006006号-44sitemap