Sathya Sathya - 4 years ago 463
HTML Question

How to implement react-date-range picker with webpack module bundler?

I'm struggling to implement react date range picker with webpack module bundler. I've followed one of the npm react components for date range picker ( If I try to implement with webpack I've got one error. That is, "Uncaught TypeError: type.toUpperCase is not a function". Please check my below code what i have tried so for,

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

var Calendarcomponent = React.createClass({
return (

module.exports = Calendarcomponent;

Answer Source

DateRange is not the default export from the react-date-range package.

In the example, note the destructured syntax during the import:

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

You would rewrite this in ES5 ala:

var DateRange = require('react-date-range').DateRange
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download