Angular的一些常用命令


Angular的一些常用命令

cmd中創建項目:

ng new taskmgr -si --style=scss

//先不安裝依賴,si 為skip install

material需要scss樣式的特性

在某個目錄下打開vscode:code .

安裝依賴: cnpm install

自動創建組件:ng generate component MyComponent,

簡寫 ng g c MyComponent

創建組件的時候也可以帶路徑,比如:ng generate component mydir/MyComponent

ng g c core/header --spec=false 不生成對應的單元測試文件

ng g c shared/confirm-dialog -it -is --spec=false inline template inline style 創建內聯式的模板

自動創建mudule: ng g m core

自動創建指令:ng g d MyDirective

自動創建服務:ng g s MyService

構建項目:ng build,如果你想構建最終的產品版本(進行優化,包壓縮等),可以用 ng build –prod

啟動開發服務器:ng serve

angular-cli文檔

 

安裝angular material

 

cnpm i --save @angular/material@2.0.0-beta.7

 

 

 

如何在你的項目里面引入開源組件庫

以 PrimeNG 為例,首先在 package.json 里面定義好依賴:

"devDependencies": {

"primeng": "^4.1.3"

}

1、 安裝

cd 你的項目目錄

npm install primeng --save-dev

 

2、 配置angular-cli.json

 

omega是一種主題,還有很多主題,bootstrap等等......

 

"styles": [

"styles.css",

"../node_modules/primeng/resources/themes/omega/theme.css",

"../node_modules/primeng/resources/primeng.min.css",

"../node_modules/font-awesome/css/font-awesome.css"

],

 

需要注意的是系統中的所有小圖標都使用font-awosome字體庫,font-awosome.css是字體圖標文件,需要安裝

 

npm install font-awesome --save

 

3、使用,需要使用的組件,都要在app.module.ts中加載

// 載入primeng模塊

import {AutoCompleteModule, TabViewModule, ButtonModule} from "primeng/primeng"

 

......

 

@NgModule({

declarations: [

AppComponent

],

imports: [

BrowserModule,

FormsModule,

HttpModule,

AutoCompleteModule,

ButtonModule,

TabViewModule

],

 

......


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM