未捕获的TypeError:System.import不是函数 [英] Uncaught TypeError: System.import is not a function
问题描述
此代码应显示包含Hello World的 div
,但我收到错误 Uncaught TypeError:System.import不是函数
。我正在关注ng-book2的入门教程视频,其中包含 index.html
中的以下代码:
This code is supposed to display a div
containing Hello World, but instead I receive the error Uncaught TypeError: System.import is not a function
. I'm following the getting started tutorial video for ng-book2, which contains the following code in index.html
:
<!DOCTYPE html>
<html>
<head>
<title>Angular 2</title>
<script src="js/traceur-runtime-0.0.90.js"></script>
<script src="js/system-0.18.4.js"></script>
<script src="js/angular2-alpha31.js"></script>
</head>
<body>
<script>System.import('js/app');</script>
<hello-world></hello-world>
</body>
</html>
和 app.ts
:
/// <reference path="../lib/node_modules/angular2/angular2.d.ts" />
import {
Component,
View,
bootstrap
} from 'angular2/angular2';
// Annotation section
@Component({
selector: 'hello-world'
})
@View({
template: '<div>Hello World</div>'
})
// Component controller
class HelloWorld {
}
bootstrap(HelloWorld);
最后是当前目录结构:
/ng2
/js
angular2-alpha31.js
app.js
app.js.map
system-0.18.4.js
system-0.18.4.js.map
traceur-runtime-0.0.90.js
index.html
寻找解决方案,唯一看似相似的问题表示系统的 config.js
存在问题。除了本教程之外,视频显示此工作没有任何配置提示。我应该提一下,这是托管在远程服务器上而不是视频中使用的本地HTTP服务器。
Looking around for solutions, the only issue that seems similar enough states there's a problem with System's config.js
. Except in this tutorial, the video shows this working without any hint of configuration. I should mention that this is being hosted on a remote server versus the local HTTP server used in the video.
开发者窗口的屏幕截图:
Screenshots of the developer window:
每个上面目录结构中显示的文件是GitHub上写的最新文件。如果我正在使用远程服务器或者我完全遗漏了其他东西,是否应该包含默认配置文件?
Each file shown in the above directory structure is the most current available on GitHub as of writing this. Is there a default configuration file I should be including if I'm using a remote server or am I missing something else entirely?
推荐答案
在进一步使用这些文件后,我发现Angular2正在用自己的对象覆盖SystemJS' System
对象。如果 angular2.js
在HTML中移动到 system.js
以上,那么语句
After playing around with the files further, I found that Angular2 is overriding SystemJS' System
object with its own. If angular2.js
moved above system.js
within the HTML, then the statement
<script>System.import('js/app');</script>
使用正确的System对象。
uses the correct System object.
这不应该发生,但暂时还是个问题。
This should not be happening, however it is an issue for the time being.
这篇关于未捕获的TypeError:System.import不是函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!