Question

Sytemjs在index.html中定义，因此从技术上讲，您可以从应用程序的任何位置执行System.import，它将起作用。但是在构建期间，在使用库时动态导入库的组件会出错：

error TS2304: Cannot find name 'System'

以下是组件代码：

import { bindable, bindingMode, customElement, noView } from 'aurelia-framework';

@noView()
@customElement('scriptinjector')
export class ScriptInjector {
  @bindable public url;
  @bindable public isLocal;
  @bindable public isAsync;
  @bindable({ defaultBindingMode: bindingMode.oneWay }) protected scripttag;
  private tagId = 'bootTOCscript';

  public attached() {
    if (this.url) {
      if (this.isLocal) {
        System.import(this.url);
        return;
      }

      this.scripttag = document.createElement('script');
      if (this.isAsync) {
        this.scripttag.async = true;
      }

      this.scripttag.setAttribute('src', this.url);
      document.body.appendChild(this.scripttag);
    }
  }

  public detached() {
    if (this.scripttag) {
      this.scripttag.remove();
    }
  }
}

尽管出现错误，项目构建并运行得很好，我尝试通过添加以下内容来解决此问题：

import System from 'systemjs';

对于确实解决错误的组件，但在运行时，此导入会导致Systemjs在app-build包中查找不正确的内容。 System.js代码单独导出。有没有办法解决这个问题并且没有错误消息并且它在运行时有效？

Answer 1

在访问隐式存在于全局范围内的事物时，这实际上更像是一般的TypeScript问题。您可以做的是声明变量而不实际导入它，如下所示：

declare var System: System;

（系统的实际类型取决于你的.d.ts的样子）

如何在Aurelia ViewModel中引用已在应用程序级别定义的库

1 个答案: