时间戳

首页 > 解决方案 > UMD 和 CommonJS (CJS) 包文件夹有何不同，我应该使用哪个？

javascript - UMD 和 CommonJS (CJS) 包文件夹有何不同，我应该使用哪个？

问题描述

我用 package.json 像这样安装了 reactjs 和 react-dom

    "dependencies": {
        "bootstrap": "^v4.1.1",
        "popper.js": "^1.14.3",
        "react": "^v16.4.1",
        "react-dom": "^16.4.1"
    }

它正确下载react了文件夹和react-dom文件夹。

两个文件夹都有cjs和umd文件夹，它们有很多 JavaScript 文件。

对我来说，它无法找到两个文件夹中的文件之间的区别。

像这样：

    URL: node_modules/react/umd
      react-development.js
      react-production.min.js

    URL: node_modules/react/cjs
       react-development.js
       react-production.min.js

与 react-dom 几乎相同。它还有文件夹cjs，umd我不知道应该使用哪个文件夹中的哪个文件来开发 React 应用程序或网站。

标签： javascriptnpmcommonjsumd

解决方案

JavaScript 最初仅用于交互式浏览器。使用 NodeJS，它可以在非浏览器上下文中使用。由于这个和其他因素，模块的格式不兼容：

  • “<a href="http://www.commonjs.org/" rel="nofollow noreferrer">CommonJS” 规范描述了对象的使用，该exports对象是 API 来声明和发现从模块导出的名称。不允许在交互式浏览器中加载 CommonJS 模块。NodeJS 是 CommonJS 格式最流行的实现。

  • “<a href="https://github.com/amdjs/amdjs-api/wiki/AMD" rel="nofollow noreferrer">异步模块定义” (AMD) 描述了如何捆绑 JavaScript 模块，假设它们将在交互式浏览器中加载。RequireJS 是更流行的模块支持库之一，它使用 AMD 模块。

  • 由于 AMD 和 CommonJS 都非常流行且彼此难以理解，因此“<a href="https://github.com/umdjs/umd" rel="nofollow noreferrer">通用模块定义”（UMD）是一个模式来制作一个可以被两者使用的模块，代价是更复杂的格式。

  • 最近，ECMAScript 2015 定义export和import语法（与上述所有不同）来支持模块。

你应该使用哪个？您需要根据构建系统中将使用这些模块的内容来回答这个问题。

今天（2022-02），最可能的答案是：在NodeJS和主要浏览器中使用 ECMAScript 模块，这些模块现在已经支持多年。如果您需要支持非常过时的 JavaScript 引擎，您可能需要其中一种较早的格式，但您应该有计划放弃对这些格式的支持。

推荐阅读