推薦一款基於Angular實現的企業級中後臺前端/設計解決方案腳手架

ng-alain 是一個企業級中後臺前端/設計解決方案腳手架,咱們秉承 Ant Design 的設計價值觀,目標也很是簡單,但願在Angular上面開發企業後臺更簡單、更快速。隨着『設計者』的不斷反饋,將持續迭代,逐步沉澱和總結出更多設計模式和相應的代碼實現,闡述中後臺產品模板/組件/業務場景的最佳實踐,也十分期待你的參與和共建。html

如何閱讀文檔前端

在開始以前有一些文檔描述約定說明,這有助於更好的閱讀:node

API相關
[] 表示屬性
() 表示事件
[()] 表示雙向綁定
ng-content 表示組件內容佔位符git

tpl 開頭表示 〈ng-template #tpl〉

前序準備#
你的本地環境須要安裝 node 和 git。咱們的技術棧基於 Typescript、Angular、g二、@delon 和 ng-zorro-antd,提早了解和學習這些知識會很是有幫助。github

安裝#
ng new demo --style less
cd demo
ng add ng-alain@next
ng serve
請參考命令行工具瞭解更多細節。設計模式

目錄結構#
ng-alain 是一個標準的 Angular CLI 構建的項目,並提供了涵蓋中後臺開發的各種功能和坑位,下面是整個項目的目錄結構。瀏覽器

├── _mock # Mock 數據規則
├── src
│ ├── app
│ │ ├── core # 核心模塊
│ │ │ ├── i18n
│ │ │ ├── net
│ │ │ │ └── default.interceptor.ts # 默認HTTP攔截器
│ │ │ ├── services
│ │ │ │ └── startup.service.ts # 初始化項目配置
│ │ │ └── core.module.ts # 核心模塊文件
│ │ ├── layout # 通用佈局
│ │ ├── routes
│ │ │ ├── ** # 業務目錄
│ │ │ ├── routes.module.ts # 業務路由模塊
│ │ │ └── routes-routing.module.ts # 業務路由註冊口
│ │ ├── shared # 共享模塊
│ │ │ └── shared.module.ts # 共享模塊文件
│ │ ├── app.component.ts # 根組件
│ │ └── app.module.ts # 根模塊
│ │ └── delon.module.ts # @delon模塊導入
│ ├── assets # 本地靜態資源
│ ├── environments # 環境變量配置
│ ├── styles # 樣式目錄
└── └── style.less # 樣式引導入口
本地開發#
安裝依賴。antd

$ yarn
遇到問題請閱讀 常見問題app

$ ng serve
啓動完成後會打開瀏覽器訪問 //localhost:4200,若你看到以下頁面則表明成功了。less

項目地址:https://github.com/ng-alain/ng-alain

原文地址:https://www.f2ecoder.net/848.html

相關文章
相關標籤/搜索