已编译的单输出文件typescript正在尝试在浏览器中加载节点模块

我有一个tsconfig文件，它将前端typescript应用程序构建为单个输出：

{
    "compilerOptions": {
        "target": "es5",
        "module": "system",
        "lib": [
            "es2015",
            "es2015.iterable",
            "dom"
        ],
        "sourceMap": true,
        "outFile": "output.js",
        "strict": true
    }
}

我使用

标记在浏览器中加载输出，并使用systemjs[和代码段一起引导应用程序：

SystemJS.import("Application")
    .then((module) => {
        console.log(module);
    })
    .catch((error) => {
        console.error(error);
    });

我对如何编译应用程序的理解是，所有npm依赖项都应该内置到

output.js

文件中。然而，我在inspector中看到的情况并非如此，浏览器试图在

加载
lodash
模块https://registry.jspm.io/lodash.js

所有npm依赖项都应内置到output.js文件中

---

不，不是。Typescript compile的输出文件只影响project的代码，而不影响在这些代码中导入的任何模块。如果您想使用bundle for browser，您应该使用像webpack之类的bundler，etcs。

您有什么具体的推荐资源吗？我正在尝试浏览这些领域？我一直在玩webpack，但没有太多内容成功。webpack应该取代tsc编译吗？我对通常需要的步骤有点困惑，或者标准workflowwebpack不是编译器的替代品-tsc做的是typescript编译，而其他的则生成javascript包。如果您以前没有经历过，并且想理解这个概念，那么值得一试阅读webpack或任何其他捆绑包的介绍，这些捆绑包的配置比webpack少。还有大量xxxx webpack quickstart示例，您可以参考现有配置。我是否需要使用SystemJS捆绑包而不是webpack，因为我在tsconfig中使用的是

系统

模块？我不确定e如果我打算构建应用程序的方式是正确的。我对正在发生的事情或我试图实现的目标的理解是：1.使用上述

.tsconfig

将

*.ts

构建到单个输出中2.使用绑定器将所有npm模块包含到

bundle.js

文件中3.将

bundle.js

包含在

标签在静态页面中的

output.js

之前我在大约6个小时后解决了这个问题。为了我自己的目的，我从中撕开并调整了

webpack.config.js

和

tsconfig.json

。我去掉了所有角度的东西，这样对我来说就行了。