部分导入的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包不能正常工作

回答

相关问题