ionic 學習筆記 二 建立工程與初步分析

2021-08-08 11:21:34 字數 2005 閱讀 9112

首先,需要建立乙個專案,作為乙個計算機專業畢業的程式設計師,沒接觸一門新的語言,都會跟老朋友見一次面,老規矩,helloworld。這次我建立了乙個帶模板的工程。跟之前hello工程做個對比,看看有什麼差別,並且簡單分析一下專案的結構。

先在終端來波**貼上:

這個結構給我的第一感覺就是需要我們手動編寫的部分在src,至於其他的是幹什麼的,查一查得到如下結果:

hooks:編譯cordova時自定義的指令碼命令,方便整合到我們的編譯系統和版本控制系統中

node_modules:node各類依賴包

resources:android/ios 資源(更換圖示和啟動動畫)

src:開發工作目錄,頁面、樣式、指令碼和都放在這個目錄下

www:靜態檔案

platforms:生成android或者ios安裝包路徑(platforms\android\build\outputs\apk:apk所在位置)

plugins:外掛程式資料夾,裡面放置各種cordova安裝的外掛程式

config.xml: 配置檔案

package.json: node安裝模組時的依據

tsconfig.json:typescript專案的根目錄,指定用來編譯這個專案的根檔案和編譯選項

tslint.json:格式化和校驗typescript

其中src工作目錄:

assets:資源目錄(靜態檔案(,js框架。。。)各種需要放置在此資料夾內,不然會出錯,(尷尬。。。)

pages:頁面檔案,放置編寫的頁面檔案,包括:html,scss,ts。(搞事情的)

theme:主題檔案,裡面有乙個scss檔案,設定主題資訊。

然後pages目錄裡的頁面檔案了,這個不用多說,就是展示出來給人看的,每個頁面包含.html檔案、.scss檔案和.ts檔案。

pages裡面就是主要要進行拓展的部分,也是要學習和大量練習的部分。那麼到這裡,關於專案的建立,和專案的結構也大致了解了。知道了每個模組的任務和分工,我們就能繼續進行**編寫了。那麼首先,先對這個自動生成的模板進行簡單的改造。做個簡單的登入介面,登入成功再跳轉到主頁面。

將login.html豐富一下: 登入

賬號密碼

記住密碼登入

接著在login.ts中新增login方法:

login(username: htmlinputelement, password: htmlinputelement) else if (password.value.length == 0) else }

當然不要忘了在login.ts中先新增tabspage的引用,import from "../tabs/tabs";

好了,儲存一下**。網頁會自動重新整理並編譯執行。到這裡,ionic建立專案的基本流程差不多就大致了解了。接下來的就死豐富頁面的內容,新增更多的業務邏輯來完善專案。此處不再進行過多贅述。

git學習二 建立工程

上次學習了git的安裝和配置,今天開始建立工程了。1.建立乙個版本庫 git的版本庫建立跟svn和cvs相比,可能顯得很是與眾不同。在git中建立版本庫只需要在你的工程目錄下執行簡單的命令就可以做到。例如我們建立乙個工程目錄 project,然後在此目錄下初始化我們的版本庫吧。mkdir proje...

Django學習筆記(一) 安裝與建立工程

django安裝 pip install django window版,注意最新版的django不支援python2.7以下版本 django建立工程 django admin startproject projectname 自定義 執行 manage.py 的命令 cd 進入專案路徑,輸入 ma...

ROS學習(2) 建立工程

建立src,放置功能包 mkdir p catkin ws src 進入src cd catkin ws src 初始化資料夾,會出現乙個cmakelists.txt檔案,告訴系統這是ros工作空間 catkin init workspace編譯工作在catkin ws資料夾下進行 catkin m...