重要 ionic和Angular的安裝步驟

2022-05-03 20:33:07 字數 1355 閱讀 9339

首先搭建好npm和node環境的最新版本安裝::

一:開始安裝ionic:

1. npm install -g ionic(全域性安裝ionic)

2. ionic start 新建的專案名稱 +模板樣式 【建立的新專案+ 5選1模板樣式】

3. cd 新建的專案名稱 (切換到--新建的專案名稱目錄下)

4. ionic serve (啟動服務)

5. ionic build (打包ionic)

//【新建專案時】,在ionic中提供了【5種多樣的模板】:

ionic start 新建的專案名稱 + (可選引數---例tabs)

1·tabs :乙個簡單的3選項卡布局

2·sidemenu:側面有可滑動選單的布局

3·blank:乙個單獨的啟動器

4·super:啟動專案超過14個可以使用的頁面設計

5·tutorial: 乙個引導專案

//使用ionic命令生成乙個【news新聞頁面】 g:generate

ionic g page news

//使用ionic命令生成乙個【news新聞模組】 g:generate

ionic g component news

總結:ionic cli 可以生成 :(例:ionic g page news--->指建立乙個新的頁面/元件 )

pages, providers, tabs, pipes, components,directives等。

二:首先搭建好npm和node環境的最新版本安裝::

開始安裝 angular::

1·npm install -g @angular/cli (全域性安裝 angular cli)

2·ng new 新建專案名稱 (建立新專案)

3·cd 新專案名稱 (切換到新專案目錄)

4·ng serve --open 或者 ng serve --o(啟動伺服器)

三:開始安裝並使用typescript:

1.使用npm安裝::

npm install -g typescript

2.構建第乙個typescript檔案::

命名為 test.ts檔案,寫入一下內容:

function greeter(person)

var user = "jane user";

document.body.innerhtml = greeter(user);

3.編譯 .ts檔案:

執行命令列輸入: tsc test.ts

可以自動將 test.ts檔案轉化為同名的 test.js檔案

4. 使用::

建立有個html檔案,引入test.js檔案即可!!

ionic框架使用以及angular環境搭建

在基於有nodejs的情況下 安裝ionic npm i g cordova ionicionic start 專案名字 選擇tabs執行 cd 專案名字 ionic serve ionic build ionic build ionic cordova platform add ios ionic...

Ionic3與Angular4新特性

之前 17年3月底 angular4.0.0正式發布,這個月 4月十幾號 ionic3又發布了,很多人看到這個估計都是一臉懵圈,其實,angular4只是angular2的後續版本,ionic3也是ionic2的後續版本,只是因為angular現在嚴格按照版本更新策略來制定版本號,所以才會一下子跳到...

Angular的重和利

1 第一重 typescript,typescript語言的特性還是比較豐富的,而且一直在發展,再就是跨語言整合問題,要想nice對第三方lib做整合,需要自己寫d.ts,針對有些第三方庫,這件事情有點麻煩。資料型別的定義,在js裡面,資料型別都是object或者陣列隨便搭配,在ts裡面,很多資料結...