如何从节点加载外部模块

Question

我有点卡住了，不知道下一步该怎么做，我一直在寻找答案，但在我尝试了所有尝试之后却没有真正找到任何可行的解决方案...

我做了一个非常简单的项目来演示我当前的问题，you can see it on github 甚至下载并运行它在你的机器上。

最后的想法是让项目本身有一个 /dist/clients.js 文件，这样我就可以在 HTML 文件 (/dist/index.html) 中使用它，因为我不能使用CommonJs 作为我的打字稿加载模块（我有几个文件，而不仅仅是一个）我选择了 amd 加载器（因此在 HTML 文件中调用了 requirejs）。

<html>
    <head></head>
    <body>
        <h1>TS Testing...</h1>
        <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js" type="text/javascript"></script>
        <script src="client.js" type="text/javascript"></script>
        <script type="text/javascript">
            require(['clients/client'],
                function(require) {
                    var sc = new require();
                }
            );
        </script>
    </body>
</html>

打字稿运行可以从 grunt ts 开始，并使用映射

创建 client.js

我遇到的问题是没有加载整个项目，报错：

来自文件 /libs/core/tc-cookies.ts:

var JsCookie: Cookies.CookiesStatic = require("js-cookie");

如何加载 npm 模块以正确使用我的项目？我在 ts-loader 选项中有 moduleResolution: "node"，但似乎没有做正确的工作...

Github project available 这个问题

Answer 1

问题是在项目的当前状态下加载上下文的顺序未知，您可以编写一些代码来提供正确的模块加载顺序或使用某种模块加载器，例如 webpack or browserify。我强烈建议选择 webpack 和 ts-loader，这是 typescript 模块加载的常见选择。

消除该错误的步骤：

更改您的 tsconfig.json，它应该如下所示：

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "rootDir": "."
    },
    "compileOnSave": false,
    "exclude": [
      "node_modules"
    ]
}

删除您 html 中的所有脚本标签。
创建 webpack.config.js 文件。请参阅 webpack.config.js 在 ts-loader npm 页面上的示例。 (栏目配置)
在 html 中使用 webpack 的输出路径创建脚本标签。

如何从节点加载外部模块

How to load external modules from node

node.js

requirejs

typescript

Github project available 这个问题