Angular CLI的簡單使用(2)

剛纔建立了myApp這個項目,看一下這個項目的文件結構.css

  

項目文件概覽

Angular CLI項目是作快速試驗和開發企業解決方案的基礎。html

你首先要看的文件是README.md。 它提供了一些如何使用CLI命令的基礎信息。 若是你想了解 Angular CLI 的工做原理,請訪問 Angular CLI 的倉庫及其Wikinode

有些生成的文件你可能以爲陌生。接下來就講講它們。git

src文件夾

你的應用代碼位於src文件夾中。 全部的Angular組件、模板、樣式、圖片以及你的應用所需的任何東西都在那裏。 這個文件夾以外的文件都是爲構建應用提供支持用的。github

 

文件npm

用途json

app/app.component.{ts,html,css,spec.ts}

使用HTML模板、CSS樣式和單元測試定義AppComponent組件。 它是組件,隨着應用的成長它會成爲一棵組件樹的根節點。瀏覽器

app/app.module.ts

定義AppModule,這個根模塊會告訴Angular如何組裝該應用。 目前,它只聲明瞭AppComponent。 稍後它還會聲明更多組件。app

assets/*

這個文件夾下你能夠放圖片等任何東西,在構建應用時,它們全都會拷貝到發佈包中。編輯器

environments/*

這個文件夾中包括爲各個目標環境準備的文件,它們導出了一些應用中要用到的配置變量。 這些文件會在構建應用時被替換。 好比你可能在產品環境中使用不一樣的API端點地址,或使用不一樣的統計Token參數。 甚至使用一些模擬服務。 全部這些,CLI都替你考慮到了。

favicon.ico

每一個網站都但願本身在書籤欄中能好看一點。 請把它換成你本身的圖標。

index.html

這是別人訪問你的網站是看到的主頁面的HTML文件。 大多數狀況下你都不用編輯它。 在構建應用時,CLI會自動把全部jscss文件添加進去,因此你沒必要在這裏手動添加任何 <script> 或 <link> 標籤。

main.ts

這是應用的主要入口點。 使用JIT compiler編譯器編譯本應用,並啓動應用的根模塊AppModule,使其運行在瀏覽器中。 你還可使用AOT compiler編譯器,而不用修改任何代碼 —— 只要給ng build 或 ng serve 傳入 --aot 參數就能夠了。

polyfills.ts

不一樣的瀏覽器對Web標準的支持程度也不一樣。 填充庫(polyfill)能幫咱們把這些不一樣點進行標準化。 你只要使用core-js 和 zone.js一般就夠了,不過你也能夠查看瀏覽器支持指南以瞭解更多信息。

styles.css

這裏是你的全局樣式。 大多數狀況下,你會但願在組件中使用局部樣式,以利於維護,不過那些會影響你整個應用的樣式你仍是須要集中存放在這裏。

test.ts

這是單元測試的主要入口點。 它有一些你不熟悉的自定義配置,不過你並不須要編輯這裏的任何東西。

tsconfig.{app|spec}.json

TypeScript編譯器的配置文件。tsconfig.app.json是爲Angular應用準備的,而tsconfig.spec.json是爲單元測試準備的。

TypeScript compiler configuration for the Angular app (tsconfig.app.json) and for the unit tests (tsconfig.spec.json).

根目錄

src/文件夾是項目的根文件夾之一。 其它文件是用來幫助你構建、測試、維護、文檔化和發佈應用的。它們放在根目錄下,和src/平級。

文件

用途

e2e/

e2e/下是端到端(End-to-End)測試。 它們不在src/下,是由於端到端測試實際上和應用是相互獨立的,它只適用於測試你的應用而已。 這也就是爲何它會擁有本身的tsconfig.json

node_modules/

Node.js建立了這個文件夾,而且把package.json中列舉的全部第三方模塊都放在其中。

.angular-cli.json

Angular CLI的配置文件。 在這個文件中,咱們能夠設置一系列默認值,還能夠配置項目編譯時要包含的那些文件。 要了解更多,請參閱它的官方文檔。

.editorconfig

給你的編輯器看的一個簡單配置文件,它用來確保參與你項目的每一個人都具備基本的編輯器配置。 大多數的編輯器都支持.editorconfig文件,詳情參見 http://editorconfig.org 。

.gitignore

一個Git的配置文件,用來確保某些自動生成的文件不會被提交到源碼控制系統中。

karma.conf.js

Karma的單元測試配置,當運行ng test時會用到它。

package.json

npm配置文件,其中列出了項目使用到的第三方依賴包。 你還能夠在這裏添加本身的自定義腳本

protractor.conf.js

Protractor使用的端到端測試配置文件,當運行ng e2e的時候會用到它。

README.md

項目的基礎文檔,預先寫入了CLI命令的信息。 別忘了用項目文檔改進它,以便每一個查看此倉庫的人都能據此構建出你的應用。

tsconfig.json

TypeScript編譯器的配置,你的IDE會藉助它來給你提供更好的幫助。

tslint.json

TSLintCodelyzer用的配置信息,當運行ng lint時會用到。 Lint功能能夠幫你保持代碼風格的統一。

相關文章
相關標籤/搜索