tsconfig.json 中模块类型的区别

Posted 2023-03-07

【中文标题】tsconfig.json 中模块类型的区别

【英文标题】：Difference between module type in tsconfig.json

【发布时间】：2017-05-10 15:18:01

【问题描述】：

在 tsconfig.json 中

    "compilerOptions": 
     "target": "es5",
     "module": "commonjs",
     "moduleResolution": "node",
     "sourceMap": true,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "removeComments": false,
     "noImplicitAny": false
  

我无法理解以下module 类型之间的区别：

“commonjs”、“amd”、“umd”、“system”、“es6”、“es2015”、“none”

问题：我应该使用哪个值以及何时应该使用它？

【参考方案1】：

CommonJS 模式（或 nodejs）：

var someOtherFunction = require('./someOtherFunction.js');
exports.add = function() 
    var sum = 0, i = 0, args = arguments, l = args.length;
    while (i < l) 
        sum += args[i++];
    
    return sum;

ES6 模式：

import someOtherFunction from './someOtherFunction.js';

export function add() 
    var sum = 0, i = 0, args = arguments, l = args.length;
    while (i < l) 
        sum += args[i++];
    
    return sum;

AMD 模式：

define(['someOtherFunction'], function () 
    return function () 
        var sum = 0, i = 0, args = arguments, l = args.length;
        while (i < l) 
            sum += args[i++];
        
        return sum;
    ;
);

异步模块定义 (AMD) 是最流行的客户端代码，而 node.js 模块（CommonJS Modules/1.1 的扩展）是服务器端环境中的主要模式。

通用模块定义 (UMD) 是一组样板配方，试图弥合 AMD 和 node.js 之间的差异，允许工程师以单一格式编写代码库，而不是编写两种格式，或在构建步骤中转换为另一种格式。

ES5 是您以前看到的普通 javascript。

您将在 Angular2 中使用 ES6，也称为 ECMAScript 2015。

【讨论】：

使用 ES6 是否支持所有新旧浏览器

显然不是，但是您定义了 target="es5" ，这意味着它将被编译为大多数浏览器都支持的 es5 。所以你很好

哪种模块类型更灵活或支持任何浏览器使用

@kokadwarprafulla，刚刚解释过，你会使用 ES6 ，它会被编译成 Es5 并且得到很好的支持，

如果第一个例子定义了“add”函数，然后通过module.exports = add 导出，不是更能暗示commonjs吗？