Question

我正在尝试构建用typescript编写的小型sdk库。我的想法是创建包含许多ts文件的项目，这些文件可以编译为一个js，我的库可以像 foo.bar.myPublicClasses

一样访问

最重要的评论我不想在简单的html页面上使用它，我的环境是Dynamics CRM，所以包括JavaScript在普通的html脚本include标签中都没有完成，并且加载JavaScript是在异步的情况下完成的构建Dynamics CRM的框架。这就是为什么我需要将我的库捆绑到一个文件的原因。因此，总结一下，我需要一个捆绑的js文件，它与d.ts文件没有任何依赖关系，所以它可以在其他打字稿文件上重用。除了从Dynamics CRM运行我的js代码之外我还需要任何全局函数，我的方法是在类foo.bar.mylibrary.sdk.create（）上的一些静态函数

我的项目结构可能如下所示：


 src/
 |-bundle.ts
 |-classes/
 | |-classA.ts
 | |-classB.ts
 | 
 |-interfaces/
 | |-IInterface1.ts
 | -IInterface2.ts
 |
 |-Helpers/
 | |-HelperA.ts
 | |-HelperA.ts
 |
 dist/
 | -myLibrary.js

我想要.ts文件更像是我每个类都要编写一个C＃代码文件等。

版本1 我最初的方法是使用命名空间，但我不确定这是否是在长期项目中做到这一点的最佳方式。在那个apporach中我在我的命名空间中写了所有ts文件，对我来说只有一个难闻的气味就是在组合的js文件中每个ts文件都会写出来

//a.ts
namespace foo.bar.mylibrary{
    class a {
        isOk:boolean;
    }
    export class b {
        constructor(){
            let test = new a();
            test.isOk = false;
        }
    }
}
//b.ts
namespace foo.bar.mylibrary{
    export class sdk{
        public isStart:boolean;
        public static Create(){
            //initialize my sdk
        }
    }
}

编译到

"use strict";
// b.ts
var foo;
(function (foo) {
    var bar;
    (function (bar) {
        var mylibrary;
        (function (mylibrary) {
            var a = (function () {
                function a() {
                }
                return a;
            }());
            var b = (function () {
                function b() {
                    var test = new a();
                    test.isOk = false;
                }
                return b;
            }());
            mylibrary.b = b;
        })(mylibrary = bar.mylibrary || (bar.mylibrary = {}));
    })(bar = foo.bar || (foo.bar = {}));
})(foo || (foo = {}));
var foo;
(function (foo) {
    var bar;
    (function (bar) {
        var mylibrary;
        (function (mylibrary) {
            var sdk = (function () {
                function sdk() {
                }
                sdk.Create = function () {
                    //initialize my sdk
                };
                return sdk;
            }());
            mylibrary.sdk = sdk;
        })(mylibrary = bar.mylibrary || (bar.mylibrary = {}));
    })(bar = foo.bar || (foo.bar = {}));
})(foo || (foo = {}));

也许有更好的方法来编译这些ts文件。

我的tsconfig包含模块 - commonjs，outputfile - myLibrary.js

版本2 根据typescript文档，现在使用外部模块会更好，但是我不确定编译的js是否是我看到的，不会将导出的类编译为简单的var对象，导出的类是在定义的函数中。

//a.ts
    class a {
        isOk:boolean;
    }
    export class b {
        constructor(){
            let test = new a();
            test.isOk = false;
        }
    }

//b.ts

    export class sdk{
        public isStart:boolean;
        public static Create(){
            //initialize my sdk
        }
    }
//build.ts
export {sdk} from "./src/b";

编译到

define(["require", "exports", "./src/classb"], function (require, exports, classb_1) {
    "use strict";
    function __export(m) {
        for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
    }
    Object.defineProperty(exports, "__esModule", { value: true });
    // export * from "./src/classa";
    __export(classb_1);
});

然后我需要捆绑我需要的模块，但我不知道如何以正确的方式进行。

我的tsconfig包含模块 - amd，outputfile - myLibrary.js

我假设要完成我的库我应该吞下一些其他工具包，但任何人都可以给我一些提示或怎么做？

Answer 1

这是我的tsconfig.json，它只转换为单个js文件

{
  "compilerOptions": {
    "module": "amd",
    "target": "es5",
    "sourceMap": true,
    "outFile": "../public/js/yourfile.js"
  },
  "exclude": [
    "node_modules",
    "typings"
  ]
}

使用typescript将小sdk构建到一个js文件

1 个答案: