整體目錄結(jié)構(gòu)

使用angular-cli搭建的項目目錄

一級目錄(介紹主要的，我們會接觸到的)

• node_modules 第三方依賴包存放目錄。
• src 應(yīng)用源代碼目錄 ，我們開發(fā)就是在這個文件夾中。
• angular.json Angular命令行工具的配置文件?？梢栽趕tyle，script數(shù)組中導入node_modules中的文件，從而不用在index.hmlt文件中引入
  都會記錄在package.json文件中。
• package-lock.json 在 npm install時候生成一份文件，用以記錄當前狀態(tài)下實際安裝的各個npm package的具體來源和版本號。如果已經(jīng)存在 package-lock.json 文件，則它只會根據(jù) package-lock.json 文件指定的結(jié)構(gòu)來下載模塊，并不會理會 package.json 文件。
• package.json 無論使用 npm 還是 yarn 安裝的包，都會記錄在 package.json 文件中。
• package.json 文件中的包被分成了兩組：

dependencies 是運行應(yīng)用的基礎(chǔ)。
devDependencies 只有在開發(fā)應(yīng)用時才會用到。

src目錄

src目錄

• app目錄包含應(yīng)用的組件和模塊，我們要寫的代碼都在這個目錄
• assets 目錄資源目錄，存儲靜態(tài)資源的 比如圖片
• environments 目錄環(huán)境配置。Angular是支持多環(huán)境開發(fā)的，我們可以在不同的環(huán)境下（開發(fā)環(huán)境，測試環(huán)境，生產(chǎn)環(huán)境）共用一套代碼，主要用來配置環(huán)境的
• index.html 整個應(yīng)用的根html，程序啟動就是訪問這個頁面
• main.ts 整個項目的入口點，Angular通過這個文件來啟動項目
• polyfills.ts 主要是用來導入一些必要庫，為了讓Angular能正常運行在老版本下
• styles.css 主要是放一些全局的樣式
• tsconfig.app.json TypeScript 編譯器的配置,添加第三方依賴的時候會修改這個文件
• test.ts 自動化測試用的

app目錄

app模塊和組件

app目錄是我們要編寫的代碼目錄。我們寫的代碼都是放在這個目錄。
一個Angular程序至少需要一個模塊和一個組件。在我們新建項目的時候命令行已經(jīng)默認生成出來了。

app.component.ts：這個文件表示組件，
組件是Angular應(yīng)用的基本構(gòu)建模塊，可以理解為一段帶有業(yè)務(wù)邏輯和數(shù)據(jù)的Html

這里插個題外話模塊和組件之間的關(guān)系：
模塊包含組件，NgModule 為其中的組件提供了一個編譯上下文環(huán)境。根模塊總會有一個根組件，并在引導期間創(chuàng)建它。 但是，任何模塊都能包含任意數(shù)量的其它組件，這些組件可以通過路由器加載，也可以通過模板創(chuàng)建。那些屬于這個 NgModule 的組件會共享同一個編譯上下文環(huán)境。

模塊和組件的關(guān)系

目錄結(jié)構(gòu)簡單梳理完畢！

謝謝各位大佬
如果你覺得本文對你有幫助，麻煩動動手指頂一下，算是對本文的一個認可，如果文中有什么錯誤的地方，還望指正，轉(zhuǎn)載請注明轉(zhuǎn)自鄒二狗的博客，謝謝