如何使用.babelrc獲取babel-plugin-import爲antd工作？

Question

我是新來的反應，babel和antd。

我安裝了反應並使用create-react-app啓動了一個項目。 我安裝了antd（ant.design）。它建議使用babel-plugin-import，所以我也安裝了它。

如果我理解正確，對巴貝爾-插件導入使用文件說，把這個在.babelrc文件：

{ 
    "plugins": [ 
    ["import", { 
     "libraryName": "antd", 
     "style": true 
    }] 
    ] 
} 

我無法得到它的工作。我的Web控制檯仍具有警示：

您使用antd的全包，請使用 https://www.npmjs.com/package/babel-plugin-import減少應用程序捆綁 大小。

我的項目目錄中沒有.babelrc文件，所以我創建了一個具有上述內容並重新啓動服務器（npm start）的文件。這沒有奏效，所以我在myProject/node_modules/babel_plugin_import中創建了一個，但這也不起作用。

該代碼段應該去哪裏？

截至https://github.com/ant-design/babel-plugin-import底部，它說

巴貝爾-插件導入會，如果你在 的WebPack配置廠商添加庫不工作。

但我不知道這意味着什麼。

我在這裏問了另一個問題：How to get antd working with app created via create-react-app? 也許這個問題與我通過create-react-app創建的項目有關？

Answer 1

[更新2018-02-06：答案仍然正確，但現在有更好的選擇，即使用react-app-rewired。這也記錄在鏈接]

您需要按照https://ant.design/docs/react/use-with-create-react-app#Import-on-demand說明一個T.

你應該不創建螞蟻.babelrc文件或相似。當使用CRA時，所有babel配置都在webpack配置文件內處理。

首先清理您創建的配置文件，並確保已安裝babel-plugin-import。

然後彈出你應用程序：npm run eject

這會給你一個config文件夾用於開發/生產環境中2的WebPack配置文件。

打開這些文件並找到需要插入plugins屬性的位置，如說明頁面中所述。