安裝 NPM 依賴
首先我們創建前端項目應該有的內容：
創建 src/index.html 文件:
<!DOCTYPE html>
<html>
<head>
<meta chartset="utf8">
<title>Angular 2 Starter</title>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
創建 app/app.component.ts 文件：
import { Component } from '@angular/core';
創建 package.json 文件，并安裝依賴項目
{
"name": "angular2-starter",
"version": "0.1.0",
"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/router": "3.0.0",
"core-js": "^2.4.1",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.12",
"zone.js": "^0.6.23"
}
}
用如下命令安裝 npm 依賴：
npm install
在 app/app.component.ts 中創建組建
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: '<h1>My App</h1>'
})
export class AppComponent { }
此時會出現一些錯誤，不用擔心，是我們的相關依賴沒有安裝完成，我們會在后面解決這個問題。
創建啟動文件 main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app/app.component.ts';
platformBrowserDynamic().bootstrapModule(AppComponent);
現在這個項目雛形已經 OK ，但是這些代碼都是基于 TypeScript 的，瀏覽器中無法運行，接下來我們會學習到如何編譯 TypeScript。
DEMO 源碼
〖堅強的一俢〗
