Creating a single AMD module from many TypeScript classes compiled as AMD modules?

I am trying to create one AMD library file (module), which is built from many small files (TypeScript files compiled for JavaScript-AMD modules).

The problem is this:

  • I have cyclical dependencies between classes. (The parent must know that the child and the child must know the parent).
  • I want to get rid of all calls to define () and require (), except for the main definition for "myLibrary"

The main reasons for creating a single file:

  • Download time (requirejs should not be used to reference all small files)
  • Cyclic dependencies that cannot (?) Be replaced by AMD modules

My main questions are:

  • Is there a tool for this? r.js (grunt-contrib-requirejs) failed for me, leaving all the internal calls to define () inside.

My current project layout is similar to the following example:

root
|-- myLibrary
|   |-- packageA
|   |   |-- ClassA1.ts
|   |   +-- ClassA2.ts
|   |-- packageB
|   |   |-- ClassB1.ts
|   |   +-- ClassB2.ts
|   |-- packageA.ts
|   +-- packageB.ts
+-- myLibrary.ts

The code myLibrary.ts is simple:

export import packageA = require("./packageA");
export import packageB = require("./packageB");

Which simply compiles to the AMD module as follows:

define(["require", "exports", "./myLibrary/packageA", "./myLibrary/packageB"], function (require, exports, packageA, packageB) {
    exports.packageA = packageA;
    exports.packageB = packageB;
});

Package files are structured in the same way. For example, packageA.ts looks like this:

// Typescript source:
export * from "./packageA/ClassA1";
export * from "./packageA/ClassA2";

// Compiled as Javascript:
define(["require", "exports", "./packageA/ClassA1", "./packageA/ClassA2"], function (require, exports, ClassA1_1, ClassA2_1) {
    function __export(m) {
        for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
    }
    __export(ClassA1_1);
    __export(ClassA1_2);
});

What is currently receiving:

define("myLibrary/packageA/ClassA1",["require", "exports"], function(require, exports) {
    var MyClassA1 = (function() {
        // The content of the class ...
    })();
    exports.MyClassA1 = MyClassA1;
});
define("myLibrary/packageA/ClassA2", ...

// The other stuff ...    

define(["require", "exports", "./myLibrary/packageA", "./myLibrary/packageB"], function (require, exports, packageA, packageB) {
    exports.packageA = packageA;
    exports.packageB = packageB;
});

What I want:

define(["require", "exports"], function(require, exports) {
    //... The entire code of packageA without define or require.
    var packageA = ...;
    //...
    export.packageA = packageA;
    export.packageB = packageB;
});
+4
source share
3 answers

They already have a set of modules in their roadmap .

TypeScript 1.6, , 1.7, vnext, .

+2

AMD. , r.js, RequireJS. AMD .

, TypeScript UMD, r.js UMD, - AMD .

, - TypeScript 1.7+, , , r.js, AMD , .

+1

Specifying --outFile in combination with --module amd or --module will combine all the modules in the compilation into a single output file containing several module closures.

See outfile + amd .

+1
source

Source: https://habr.com/ru/post/1609180/


All Articles