使用create-react-app方式引入antd樣式
阿新 • • 發佈:2018-11-27
今天試了一下使用create-react-app快速構建React 的環境下引用antd,but! 引入後發現我的antd的樣式壓根就沒有引入, 所以上網搜尋了一下
點此進入快速構建React開發環境
以下給出的解釋:
由於create-react-app構建React App的方式推薦zero-configuration(零配置),所以只能通過 npm run eject 的方式來講所有的配置項暴露出來。要注意的eject操作是不可逆轉的。
引入antd
我是使用
yarn add antd
引入antd
安裝babel-plugin-import
npm install babel-plugin-import --save-dev
暴露配置項
npm run eject
發現執行此操作報錯了
不管他什麼錯
接著執行
yarn install
然後執行
npm run eject
此時可以成功 .會自動生成一個config的資料夾,時候我們先配置dev模式,
開啟config資料夾下面的webpack.config.dev.js檔案
就是新增如下程式碼
plugins: ['transform-runtime', ['import', {
libraryName: 'antd',
style: 'css'
}]]
但是當你執行npm start 的時候會發現不行 報錯了.
那麼此時只要是再執行一次npm install 就可以 然後執行
npm start
專案就可以執行啦