gpt4 book ai didi

angular - Uncaught ReferenceError : System is not defined - Angular2

转载 作者:太空狗 更新时间:2023-10-29 17:48:54 27 4
gpt4 key购买 nike

index.html 页面加载到屏幕上并显示加载中。但是我没有看到我在 app.component.ts 的模板属性中定义的文本“我的第一个组件”。当我按 F12 打开开发者工具时,我看到错误:

Uncaught ReferenceError: System is not defined.

它指向 app.component.js 文件中的第一行。有人可以告诉我问题出在哪里吗?

app.component.ts

import { Component } from '@angular/core';

@Component({
selector: 'pm-app',
template: `
<div>
<h1>{{pageTitle}}</h1>
<div> My First Component </div>
</div>
`

})

export class AppComponent {
pageTitle: string = 'Hello World';
}

tsconfig.json

{
"compilerOptions": {
"target": "ES5",
"module": "system",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"removeComments": false,
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
},
"exclude": [
"node_modules"
]
}

index.html

<!DOCTYPE html>
<html>

<head>
<title>Angular 2 Application</title>
<meta name="viewport" content="width=device-width, initial-scale=1">

<link href="app/app.component.css" rel="stylesheet" />

<!-- 1. Load libraries -->
<!-- IE required polyfills, in this exact order -->



<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>

<script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
<script src="node_modules/@angular/core/core.umd.js"></script>
<script src="node_modules/@angular/common/common.umd.js"></script>
<script src="node_modules/@angular/compiler/compiler.umd.js"></script>
<script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
<script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>

<script src='app/app.component.js'></script>
<script src='app/main.js'></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/main')
.then(null, console.error.bind(console));
</script>
</head>

<body>
<pm-app>Loading..</pm-app>
</body>

</html>

ma​​in.ts

import { bootstrap } from '@angular/platform-browser-dynamic';

// Our main component
import { AppComponent } from './app.component';

bootstrap(AppComponent);

最佳答案

尝试移动

<script src="node_modules/systemjs/dist/system.src.js"></script> 

在你的 rxjs 脚本声明之上

关于angular - Uncaught ReferenceError : System is not defined - Angular2,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37258185/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com