Question

不幸的是，使用Angular似乎需要很多配置文件和基础文件才能运行项目。我没有用代码乱码此页面并进行大量复制粘贴工作，而是将其放在可以克隆并运行here的存储库中。或者可以使用StackBlitz here在线运行。 StackBlitz也无法解析应从VSS Web扩展软件包中包含的“ TFS”软件包。

我正在尝试同时使用VSS Web Extension SDK和Angular来为Azure仪表板创建自定义窗口小部件。 （请注意，此问题不需要访问Azure）

我无法加载要在运行时使用的库，并且不确定原因。

我遇到以下错误。

Uncaught ReferenceError: TFS is not defined
    at Object.TFS/Dashboards/WidgetHelpers (WidgetHelpers":1)
    at __webpack_require__ (bootstrap:79)
    at Object../src/app/app.component.ts (Binding.component.ts:14)
    at __webpack_require__ (bootstrap:79)
    at Object../src/app/app.module.ts (app.component.ts:76)
    at __webpack_require__ (bootstrap:79)
    at Object../src/main.ts (environment.ts:19)
    at __webpack_require__ (bootstrap:79)
    at Object.0 (polyfills.ts:72)
    at __webpack_require__ (bootstrap:79)

我有一个自定义的webpack配置文件，以扩展默认的角度构建webpack配置，

module.exports = {
    externals: [
        /^VSS\/.*/, /^TFS\/.*/, /^q$/
    ]
};

外部因素是从一个似乎建立了Webpack配置文件的项目中提取的，该文件名为Generator VSTS Extension。他们的配置可以访问here。我在编译时遇到构建问题后才发现这个问题。

该错误是在运行时从app.component.ts文件生成的。当涉及库的行被注释掉时，就没有问题。

我对Webpack和Angular都是陌生的，所以我在扩展Angular构建器时可能犯了一个错误，但我不确定。有人对我做错了什么建议吗？

我已经将一个最小的可运行示例项目上传到GitHub，只要您设置了npm，就可以下载并运行该项目。您可以获取该here。使用StackBlitz

Angular中的外部元素

0 个答案: