使用来自TypeScript的TypeScript库

Question

我正在尝试创建一个简单的TypeScript库，并从不同的TypeScript示例项目中测试它，这样我就可以验证并显示该库在不同的模块格式(包括TypeScript )下是可用的。

对于库，我将它编译成UMD代码，并将它与声明文件一起输出到一个"build“目录中，稍后我将从package.json文件中引用该目录。就像这样：

tsconfig.json

{
    "compilerOptions": {
        "module": "umd",
        "outDir": "build",
        "declaration": true,
        ...
    },
    ...
}

package.json

{
    "main": "build/index.js",
    "types": "build/index.d.ts",
    ...
}

值得一提的是，库是多个文件的组合，而index.js只是将它的不同部分粘合在一起，通过一个入口点公开它们。

现在，从其中一个示例项目中，我的目标是编译成AMD代码，并使用RequireJS来理解结果。我能够编写TypeScript代码，编译器对所有导入都很满意，编辑器(VS代码)提供了正确的自动完成功能。但是，编译后的代码不包括上述库的代码，这是它的依赖项之一。在浏览器中运行代码时，RequireJS无法加载库。以下是如何配置此项目：

tsconfig.json

{
    "compilerOptions": {
        "module": "amd",
        "outFile": "build/app.js"
    },
    ...
}

index.html

...
    <script src="node_modules/requirejs/require.js"></script>
    <script src="build/app.js"></script>
    <script>
        require(['main'])
    </script>
...

这样，RequireJS就会尝试从"/ library -name.js“加载库，而这个库当然不存在。

我不知道该怎么做。

Answer 1

您需要提供一个RequireJS配置，以便RequireJS可以找到您的库。或者，您需要将库移动到默认情况下RequireJS查找它的位置。两者都是可能的选择。

例如，如果您的开发服务器恰好为您的示例项目提供node_modules服务，其中大概已经安装了library-name，那么您可以使用如下配置：

require.config({
  paths: {
    "library-name": "/node_modules/library-name/build/index",
  },
});

我假设node_modules是从您的开发服务器建立的站点的根部提供的。路径中缺少.js扩展并不是一个错误:您没有将.js放在那里，因为RequireJS添加了它。

Answer 2

我想我得到了它，在另一个帮助下，除了其他的问题：RequireJS relative paths。

因此，从本质上说，我必须以这样的方式配置RequireJS：

require.config({
    packages: [{
        name: 'module-name',
        location: 'node_modules/module-directory/build',
        main: 'index'
    }]
})

否则，如果我只包含索引文件的路径，则索引使用的所有相对路径都会相对于根解析，这是相当愚蠢的，但可以……

令我惊讶的是，baseUrl (2.6.2)编译器的paths和TypeScript选项没有帮助，实际上编译后的代码与这些字段是否被填充完全相同(我试图为它们使用RequireJS中帮助加载索引文件的相同值)。

编辑

如果有人感兴趣，下面是我在使用SystemJS时所需的配置：

SystemJS.config({
    paths: {
        'module-name': 'node_modules/module-directory/build/index'
    },
    packages: {
        '': {
            defaultExtension: 'js'
        }
    }
})