RequireJS 는 AMD API (소스)를 구현합니다 .

CommonJS 는 exports모듈 컨텐츠를 정의 하는 오브젝트 의 도움으로 모듈을 정의하는 방법입니다 . 간단히 말해 CommonJS 구현은 다음과 같이 작동 할 수 있습니다.

// someModule.js
exports.doSomething = function() { return "foo"; };

//otherModule.js
var someModule = require('someModule'); // in the vein of node    
exports.doSomethingElse = function() { return someModule.doSomething() + "bar"; };

기본적으로 CommonJS는 require()종속성을 가져 오기 위한 함수, exports모듈 컨텐츠를 내보내는 변수 및 종속성을 요구하는 데 사용되는 모듈 식별자 (이 모듈과 관련하여 문제가있는 모듈의 위치를 ​​설명하는)가 있어야 함을 지정합니다 ( source ). CommonJS에는 Node.js를 포함하여 다양한 구현 이 있습니다.

CommonJS는 브라우저를 염두에두고 특별히 설계되지 않았으므로 브라우저 환경에 잘 맞지 않습니다 ( 실제로 소스가 없습니다 . RequireJS 사이트를 포함 하여 모든 곳에서 사용 가능 합니다 ) . 비동기 로딩 등으로 수행

반면에 RequireJS는 브라우저 환경 ( source ) 에 맞게 설계된 AMD를 구현 합니다. 분명히, AMD는 CommonJS Transport 형식의 분사로 시작하여 자체 모듈 정의 API로 발전했습니다. 따라서 둘 사이의 유사점. AMD의 새로운 기능 define()은로드하기 전에 모듈이 종속성을 선언 할 수 있도록하는 기능입니다. 예를 들어, 정의는 다음과 같습니다.

define('module/id/string', ['module', 'dependency', 'array'],
function(module, factory function) {
  return ModuleContents;
});

따라서 CommonJS와 AMD는 구현이 서로 다른 JavaScript 모듈 정의 API이지만 둘 다 동일한 출처에서 나옵니다.

• AMD 는 모듈 종속성의 비동기 로딩을 지원하므로 브라우저에 더 적합합니다.
• RequireJS 는 AMD 의 구현이며 , 동시에 CommonJS 의 정신 (주로 모듈 식별자) 을 유지하려고합니다 .

RequireJS는 AMD를 구현하는 동안 CommonJS 래퍼를 제공하므로 RequireJS와 함께 사용하기 위해 CommonJS 모듈을 거의 직접 가져올 수 있습니다.

define(function(require, exports, module) {
  var someModule = require('someModule'); // in the vein of node    
  exports.doSomethingElse = function() { return someModule.doSomething() + "bar"; };
});

이것이 문제를 명확히하는 데 도움이되기를 바랍니다.

답변

// package/lib is a dependency we require
var lib = require( "package/lib" );

// behavior for our module
function foo(){
    lib.log( "hello world!" );
}

// export (expose) foo to other modules as foobar
exports.foobar = foo;

// package/lib is a dependency we require
define(["package/lib"], function (lib) {

    // behavior for our module
    function foo() {
        lib.log( "hello world!" );
    }

    // export (expose) foo to other modules as foobar
    return {
        foobar: foo
    }
});

require(["package/myModule"], function(myModule) {
    myModule.foobar();
});

import myDefault from "my-module";

"use strict";
var _myModule = require("my-module");
var _myModule2 = _interopRequireDefault(_myModule);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }