編輯:
我還沒弄清楚到底爲什麼沒有工作,但我從無到有,得到了working version。似乎沒有必要在angular
腳本標記之前放system.src.js
,步速下面的答案之一。查看工作版本和Angular 2 tutorial。角2:的ReferenceError:要求沒有定義(...),angular2-polyfills
原題:
我努力學習角2和快遞。我一般遵循this指南。我收到以下錯誤:
ReferenceError: require is not defined(…) angular2-polyfills.js:1243
Zone.run @ angular2-polyfills.js:1243
zoneBoundFn @ angular2-polyfills.js:1220
lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468
lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480
lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451
lib$es6$promise$$internal$$publishRejection @ angular2-polyfills.js:401
(anonymous function) @ angular2-polyfills.js:123
Zone.run @ angular2-polyfills.js:1243
zoneBoundFn @ angular2-polyfills.js:1220
lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
編輯:here是破碎的版本在GitHub上的項目。
我的項目的結構,像這樣:
application
|__client
|__app
|__main.ts
|__main.js
|__tsconfig.json
|__typings/ (...)
|__index.html
|__typings.json
|__server
|__server.ts
|__server.js
|__tsconfig.json
|__typings.json
|__node_modules/ (...)
文件server.ts
是這樣的:
import * as express from "express";
let path = require("path");
let app = express();
let PORT = 8080;
app.use("/node_modules", express.static(__dirname + "/../node_modules"));
app.use("/app", express.static(__dirname + "/../client/app"));
app.get("/", (req, res) => {
res.sendFile(path.resolve(__dirname, "..", "client", "index.html"));
});
app.listen(PORT,() => { console.log("Listening on port " + PORT)});
的main.ts
文件是這樣的:
import {Component} from "angular2/core";
import {bootstrap} from "angular2/platform/browser";
@Component({
selector: "app",
template: "<h1>Hello world</h1>"
})
export class AppComponent {}
bootstrap(AppComponent);
的index.html
文件像這樣:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/es6-shim/es6-shim.min.js"></script>
<script src="node_modules/systemjs/dist/system-polyfills.js"></script>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<!-- <script src="node_modules/systemjs/dist/system.src.js"></script> -->
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script>
System.config({
packages: {
app: {
format: "register",
defaultExtension: "js"
}
}
});
System.import("app/main")
.then(null, console.error.bind(console));
</script>
</head>
<body>
<app></app>
</body>
</html>
而且tsconfig.json
文件都非常喜歡這樣的:
{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"isolatedModules": false,
"jsx": "react",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"declaration": false,
"noImplicitAny": true,
"removeComments": false,
"noLib": false,
"preserveConstEnums": true,
"suppressImplicitAnyIndexErrors": true
},
"exclude": [
"node_modules",
"typings/browser",
"typings/browser.d.ts"
],
"compileOnSave": true,
"buildOnSave": false,
"atom": {
"rewriteTsconfig": false
}
}
感謝。
貌似http://stackoverflow.com/questions/34730010/angular2-5-minute-install-bug-require-的DUP is-not-defined或者http://stackoverflow.com/questions/34874490/uncaught-referenceerror-require-is-not-defined-in-angular2 –
嗯。我已經看到了這些,但改變路徑到'../ app.component.js'不起作用,就像在第一個鏈接中一樣,並且我的'index.html'文件中已經有'system.src.js'。所以我不確定這些工作,除非我誤解了答案。 –