鍍金池/ 問(wèn)答/HTML5  HTML/ antd按需加載樣式加載延遲？

antd按需加載樣式加載延遲？

antd是按需引入的 然后本地沒(méi)問(wèn)題 線上會(huì)現(xiàn)出來(lái)html 再出來(lái)樣式 閃爍一下
如下圖

clipboard.png

clipboard.png

實(shí)際上可能就0.3秒的樣式 但是閃爍非常難受。。。。

按需加載配置是在package.json 中寫的

"babel": {
    "presets": [
      [
        "es2015"
      ],
      "react-app",
      "stage-1"
    ],
    "plugins": [
      "transform-decorators-legacy",
      [
        "import",
        {
          "libraryName": "antd",
          "libraryDirectory": "es",
          "style": "css"
        }
      ]
    ]
  },
回答
編輯回答
安于心

webpack 沒(méi)配置好吧。
一般來(lái)說(shuō)開(kāi)發(fā)環(huán)境使用 style-loader 來(lái)加載樣式，方便熱更新。因?yàn)槭欠旁趈s里面的，所以要加載js才會(huì)生效。
生產(chǎn)環(huán)境的話應(yīng)該要把樣式打包成css文件，在頭部引入，保證css先加載，就不會(huì)有閃爍了。

2018年3月24日 10:02
編輯回答
傻丟丟

你應(yīng)該是給body上沒(méi)有加height引起的

body {
    height: 100vh;
}
2018年3月27日 17:38
編輯回答
默念

用 extract-text-webpack-plugin把css從js里抽離出來(lái)

2017年11月30日 07:33