教程：angular6 + ng-zorro鹿途后臺管理系統(tǒng)（一）

從零開始用Angular6 + ng-zorro 完成一個完整的后臺管理系統(tǒng)，系列文章前提是你已經(jīng)具備一定的Angular開發(fā)經(jīng)驗，至少可以完成開發(fā)環(huán)境的搭建，話不多說我們開始吧！

鹿途登陸頁

版本說明

  • ng-zorro-antd 1.4.1+
  • angular 6+
  • node 10+

開發(fā)工具

  • Mac
  • Vscode

開始

創(chuàng)建項目

在創(chuàng)建項目之前，請確保 @angular/cli 已被成功安裝

執(zhí)行以下命令，@angular/cli 會在當(dāng)前目錄下新建一個名稱為ng-deerway的文件夾，并自動安裝好相應(yīng)依賴。

ng new ng-deerway

初始化配置

進入項目文件夾，執(zhí)行以下命令后將自動完成 ng-zorro-antd 的初始化配置，包括引入國際化文件，導(dǎo)入模塊，引入樣式文件等工作。

ng add ng-zorro-antd

開發(fā)調(diào)試

一鍵啟動調(diào)試，運行成功后顯示歡迎頁面。

ng serve

運行成功

我們通過腳手架和NG-ZORRO的配合已經(jīng)完成了項目的基本的骨架，過程都大同小異，大家可以參考NG-ZORRO的快速上手，下一節(jié)我們將開始項目整體結(jié)構(gòu)的規(guī)劃。

項目github地址：https://github.com/ZhouRenYou/ng-deerway
項目預(yù)覽地址（非實時更新）：https://zhourenyou.github.io/web-deerway/passport/login

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,323評論 25贊 708
  • 用兩張圖告訴你，為什么你的 App 會卡頓? - Android - 掘金 Cover 有什么料？ 從這篇文章中你...
    hw1212閱讀 14,097評論 2贊 59
  • Angular版本的 Ant Design 總算發(fā)布了，其名曰：ng-zorro-antd。 這人要是越期待，心就...
    cipchk閱讀 13,859評論 0贊 6
  • 河水一源形彌彌，漫風(fēng)生酒舍，皓月照書窗。漁港清幽臨水岸，溪叟又新居，燕聲喜裊裊。 泰山萬仞勢巖巖，芳草正萋萋，松柏...
    文青文清閱讀 680評論 2贊 5
  • 最近發(fā)現(xiàn)了一款比較好用的Markdown預(yù)覽插件——markdown-preview-enhanced 它可以實時...
    夜瑾漠閱讀 3,159評論 0贊 0

友情鏈接更多精彩內(nèi)容