Question

我有一个用ES6编写的组件库，其index.js如下所示：

export {default as Button} from './Components/BaseComponents/Button';
export {default as TextBox} from './Components/BaseComponents/TextBox';
export {default as CheckBox} from './Components/BaseComponents/CheckBox';

这是一个使用Babel 6的遗留项目，带有.babelrc，例如：

{
  "presets": ["env","react"]
}

它输出如下所示的已编译index.js：

var _Button = require('./Components/BaseComponents/Button');

Object.defineProperty(exports, 'Button', {
  enumerable: true,
  get: function get() {
    return _interopRequireDefault(_Button).default;
  }
});

var _TextBox = require('./Components/BaseComponents/TextBox');

Object.defineProperty(exports, 'TextBox', {
  enumerable: true,
  get: function get() {
    return _interopRequireDefault(_TextBox).default;
  }
});

不幸的是，当我使用此组件库时，例如：

import { Button } from 'my-library'

最终从组件库中提取整个CSS。如果我这样做：

import Button from 'my-library/Components/BaseComponents/Button';

问题自然消失了。问题是：我该如何设置Babel来以一种我不会最终拉入所有路径/需求/分辨率的方式来转运我的index.js？

React组件库babel设置用于导入消耗

0 个答案: