Angular6下使用ng-zorro-antd框架的坑
阿新 • • 發佈：2018-07-25
記錄 下使用 依賴包 出了 前端 ng- 做到 節點 styles 最近因為需要開發一個前後端分離的應用，一看angular6出來了，就立馬想要用用看，所以立馬確立了angular6+ng-zorro-antd的前端，但是在使用中發現，我沒法引入相應的樣式，看我的引入沒有任何問題，通過1個多小時的查找資料，百度，分析，找出了這個坑。如下，現在項目也完成了也就來記錄一下，希望有跟我一樣問題的小夥伴可以免去一些麻煩。
https://github.com/angular/angular-cli/issues/10430 上面的鏈接是講angular-cli 6.0的一些問題，包括了我這個問題，內容可以進入查看，便於理解。 1.angular6改變 .angular-cli.json 變成 angular.json 若幹由根目錄文件轉移至 src 目錄中 ./karma.js 放入 src package.json 的 browserslist 節點轉換成 ./src/browserslist 文件形式 e2e 目錄變化 ./protractor.conf.js 放入 e2e e2e 目錄增加 src 目錄且將文件轉移至該目錄中，且註意相關路徑 目錄文件結構變化並不是很大，也很好理解，可以自行對照。或者去查看angular6的版本說明。 2.ng-zorro是否支持angular6？ http://ng.ant.design/docs/introduce/zh 查看最新版本說明，是支持angular^6.0.0。 3.如何解決該問題 a.如果不需要定制主題 直接把angular.json文件中添加zorro的樣式文件如下代碼： "styles": ["node_modules/ng-zorro-antd/src/ng-zorro-antd.min.css"] b.如果需要定制主題 因為受限與https://github.com/angular/angular-cli/issues/10430的問題 所以我們必須將less降級 #npm i --save less@~2.7.0 當依然遇到無法找到 ng-zorro-antd.less 文件時，相當程度是 less 路徑因素， 主要包括： 使用 cnpm 安裝依賴包，其軟鏈接破壞了實質的包路徑，使用 npm 或 yarn。 ~@ng-zorro-antd 替換成 node_modules/ng-zorro-antd。 備註：在確定好一個項目搭建框架之前，先要做好調研工作，不能一味追求最新版本，這樣成本會很大的，如果問題越早發現了還好，能夠及時的評估和解決，若是做到中途或者後面快結束發現就會很蛋疼。
Angular6下使用ng-zorro-antd框架的坑