搭建本地开发环境
《快速起步》在线编程例子是 Angular 的游乐场。 它不是开发真实应用的地方。 你应该在自己的电脑上本地开发... 你也应该在本地环境学习 Angular。
利用github 上的@H_301_10@《快速起步》种子在你的电脑上搭建一个新项目是很快很容易的。
这个QuickStart种子的live example就是QuickStart加上app.module.ts
和main.ts
文件 (稍后会讲到),它能让制作更复杂的应用例子更简便。
确定你已经安装了node 和 npm,然后:
克隆
运行下列命令来执行克隆并启动步骤。
git clone https://github.com/angularquickstartgit quickstart cd quickstart npm install npm start
npm start
fails inBash for Windowswhich does not support networking to servers as of January,2017.
下载
下载《快速起步》种子并解压到你的项目目录中。然后执行下面的命令完成剩余步骤。
Deletenon-essentialfiles (optional)
You can quickly delete thenon-essentialfiles that concern testing and QuickStart repository maintenance (@H_301_10@including all git-related artifactssuch as the.git
folder and.gitignore
!).
Do this only in the beginning to avoid accidentally deleting your own tests and git setup!
Open a terminal window in the project folder and enter the following commands for your environment:
OS/X (bash)
Windows
《快速起步》种子库里都有什么?
《快速起步》种子包含了与《快速起步》游乐场一样的应用。该应用有自己的游乐场, 但是,它真正的目的是提供坚实的本地开发基础。 所以你的电脑里的项目目录里面有更多文件,参见搭建剖析。
注意/app
目录中以下三个 TypeScript (.ts
) 文件:
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; AppModule './app/app.module' platformBrowserDynamic().bootstrapModule(AppModule);
All guides and cookbooks haveat least these core files. Each file has a distinct purpose and evolves independently as the application grows.
Files outsidesrc/
concern building,deploying,and testing your app. They include configuration files and external dependencies.
Files insidesrc/
"belong" to your app. Add new Typescript,HTML and CSS files inside thesrc/
directory,most of them insidesrc/app
,unless told to do otherwise.
所有指南和烹饪书都至少有这几个核心文件。每个文件都有独特的用途,并且随着应用的成长各自独立演变。
文件 |
用途 |
---|---|
app/app.component.ts |
定义与《快速起步》游乐场同样的 |
app/app.module.ts | 定义AppModule ,根模块为 Angular 描述如何组装应用。 目前,它只声明了AppComponent 。 不久,它将声明更多组件。 |
main.ts |
使即时 (JiT) 编译器用编译应用并且在浏览器中启动并运行应用。 对于大多数项目的开发,这都是合理的选择。而且它是在像 Plunker 这样的在线编程环境中运行例子的唯一选择。 你将在本文档中学习其他编译和开发选择。 |
下一步
如果你是 Angular 初学者,建议根据@L_403_17@学习。