溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Angular6下使用ng-zorro-antd框架的坑

發(fā)布時間:2020-07-06 10:01:15 來源:網(wǎng)絡 閱讀:16957 作者:刺激樂天派 欄目:web開發(fā)

最近因為需要開發(fā)一個前后端分離的應用,一看angular6出來了,就立馬想要用用看,所以立馬確立了angular6+ng-zorro-antd的前端,但是在使用中發(fā)現(xiàn),我沒法引入相應的樣式,看我的引入沒有任何問題,通過1個多小時的查找資料,百度,分析,找出了這個坑。如下,現(xiàn)在項目也完成了也就來記錄一下,希望有跟我一樣問題的小伙伴可以免去一些麻煩。

https://github.com/angular/angular-cli/issues/10430

上面的鏈接是講angular-cli 6.0的一些問題,包括了我這個問題,內(nèi)容可以進入查看,便于理解。

1.angular6改變
        .angular-cli.json 變成 angular.json
        若干由根目錄文件轉(zhuǎn)移至 src 目錄中

        ./karma.js 放入 src
        package.json 的 browserslist 節(jié)點轉(zhuǎn)換成 ./src/browserslist 文件形式

        e2e 目錄變化
        ./protractor.conf.js 放入 e2e
        e2e 目錄增加 src 目錄且將文件轉(zhuǎn)移至該目錄中,且注意相關路徑
        目錄文件結(jié)構變化并不是很大,也很好理解,可以自行對照?;蛘呷ゲ榭碼ngular6的版本說明。

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 安裝依賴包,其軟鏈接破壞了實質(zhì)的包路徑,使用 npm 或 yarn。
                                ~@ng-zorro-antd 替換成 node_modules/ng-zorro-antd。

    備注:在確定好一個項目搭建框架之前,先要做好調(diào)研工作,不能一味追求最新版本,這樣成本會很大的,如果問題越早發(fā)現(xiàn)了還好,能夠及時的評估和解決,若是做到中途或者后面快結(jié)束發(fā)現(xiàn)就會很蛋疼。
向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內(nèi)容。

AI