javascript - 如何使用 webpack 模块打包器实现 react-date-range picker？

Question

我正在努力使用 webpack 模块 bundler 实现 React 日期范围选择器。我遵循了日期范围选择器 ( https://www.npmjs.com/package/react-date-range ) 的 npm react 组件之一。如果我尝试使用 webpack 实现，我会遇到一个错误。也就是说，“未捕获的 TypeError:type.toUpperCase 不是函数”。请检查我下面的代码，我已经尝试过，

var React  = require('react');
var DateRange = require('react-date-range');

var Calendarcomponent = React.createClass({
  handleSelect:function(range){
    console.log(range);
  },
  render:function(){
      return (
        <div>
          <DateRange
            onInit={this.handleSelect}
            onchange={this.handleSelect}
          />
        </div>
      )
  }
});

module.exports = Calendarcomponent;

Answer 1

DateRange 不是 react-date-range 包的默认导出。

在示例中，请注意导入期间的解构语法:

import { DateRange } from 'react-date-range'

你可以用 ES5 ala 重写它:

var DateRange = require('react-date-range').DateRange