ionic4目錄結構


通過項目實戰 ,今天讓我們來了解下ionic的目錄結構




整體目錄
在這裏插入圖片描述

【vscode】:裏面是關於vscode對項目的管理,當前裏面放的是默認打開的瀏覽器。

【e2e】:ionic4.x中端對端測試文件,開發過程中一般用不到 。

【node_modules】: 此爲我們用npm(cnpm)命令從 本地安裝的依賴包,當然如果我們需要導入其他的包都會放到這裏,然後將索引 之類的放到package.json文件中。

【platforms】:此爲打包的時候生成 的文件,生成android或者ios安裝包需要的資源—(cordova platform add android後會生成)

【plugins】:此爲打包的時候生成 的文件,插件文件夾,裏面放置各種cordova安裝的插件

【vscode】[resources]: android/ios資源(更換圖標和啓動動畫)
在這裏插入圖片描述
{[src]} :此爲我們開發人員掌握的地方:工作目錄、頁面、樣式、腳本和圖片都在此。
【www】:靜態 文件,ionic build --prod生成的單頁面靜態資源文件,裏面都是我們用到的map、png、js等文件。

【angulardoc.json】【angular.json】:angular配置文件

【gitgnore】:git設置忽略文件:忽略文件詳情參照

【config.xml】:打包成app配置文件

【ionic.config.json】 【ionic.starter.json】 :ionic配置文件

【package-lock.json】 :運行npm(cnpm)install / i命令自動生成的包,用於記錄 安裝各個包的來源和 版本號

【package.json】 :主要用來 定義 項目中需要依賴包,就是後來自己輸入 npm 其他的包(例如:npm install ng2-file-upload --save)。

【readme.txt】:根據項目設置的文本框,用來記錄我們的依賴和配置文件記錄等內容。

【tsconfig.json】:TS項目的根目錄,指定用來編譯這個項目的根文件和編譯選項。

【tslint.json】:格式化和校驗ts

【yarn.lock】:是一個可靠安全的依賴管理工具 ,他是自動生成的,yarn使用確定算法在將文件放置到需要的位置前構建整個依賴 關係樹。參照博客 官網




src內部目錄
在這裏插入圖片描述

【app】:應用根目錄(組件、頁面、服務、模塊)

【assets】:內部資源文件(靜態文件(圖片,js框架…))

【environments】:配置啓動路徑:是否服務器還是本地

【theme】:主題文件 ,裏面有scss文件,可設置白晝模式。

【global.scss】:全局樣式css文件。

【index.html】:index入口文件

【main.ts】主入口文件

【karma.conf.js】【test.ts】:測試相關配置文件

【polyfills.ts】:主要包含angular需要的填充,並在應用程序之前加載

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章