部分導入的antd包不能正常工作

我使用babel-plugin-import插件導入antd包。但是，我收到整個包被導入的警告。部分導入的antd包不能正常工作

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

我給JSX的WebPack配置如下：

{ 
    test: /\.jsx$/, 
    loader: 'babel-loader', 
    exclude: [nodeModulesDir], 
    options: { 
     cacheDirectory: true, 
     plugins: [ 
      'transform-decorators-legacy', 
      'add-module-exports', 
      ["import", { "libraryName": "antd", "style": true }], 
      ["react-transform", { 
       transforms: [ 
        { 
         transform: 'react-transform-hmr', 
         imports: ['react'], 
         locals: ['module'] 
        } 
       ] 
      }] 
     ], 
     presets: ['es2015', 'stage-0', 'react'] 
    } 
},

出於某種原因，整個antd束被導入。

來源

2017-06-15 vijayst

你是如何導入antd組件的？ – wuxiandiejia

通常的方法：'從'antd''導入{Button} – vijayst

我發現一個註釋'babel-plugin-import文件將無法正常工作，如果您在[webpack config vendor。 ]（https://github.com/ant-design/babel-plugin-import#note）。 – wuxiandiejia

我想通了這個問題。我創建了一個包searchtabular-antd。該軟件包使用babel transpiler輸出javascript。在包裝中的下面線引起的問題：

import { DatePicker, Checkbox, Input, InputNumber } from 'antd';

的組件應該從LIB手動導入如下：

import DatePicker from 'antd/lib/date-picker';

這種固定在其中使用searchtabular-antd主要的應用程序的antd大小。

來源

2017-06-15 13:16:17 vijayst

部分導入的antd包不能正常工作

回答

相關問題