Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue with React v16.2.0 #166

Closed
DrEVILish opened this issue Mar 4, 2018 · 3 comments
Closed

Issue with React v16.2.0 #166

DrEVILish opened this issue Mar 4, 2018 · 3 comments

Comments

@DrEVILish
Copy link

I updated my project (2 years old) to React v16 version numbers below
"react": "^16.2.0",
"react-bootstrap": "^0.32.1",
"react-bootstrap-daterangepicker": "^4.1.0",
"react-dom": "^16.2.0",

I'm now getting an issue when I load any page with the date picker, the page fails to load and I receive this error

"Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object"

I stripped back my implementation but I'm still getting the issue

class DateSelection extends React.Component{
  render() {
    return (
      <DateRangePicker startDate="1/1/2014" endDate="3/1/2014">
        <button>Click Me To Open Picker!</button>
      </DateRangePicker>
    );
  }
}
@skratchdot
Copy link
Owner

So this is just a proptype warning message? A couple things this brings up: I should create a dev and prod version of this package's bundle (similar to how react does it). No need for type checking in production.

Does the component actually work (but it is just logging warning messages in the console)?

If you are using babel, you can look into:
https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types
and
https://github.com/jamiebuilds/babel-react-optimize

I am going to see if there's a way to fix this. I'm not sure why passing the startDate and endDate as a string is logging that message. Perhaps the message will go away if you do the following instead (untested):

class DateSelection extends React.Component{
  render() {
    return (
      <DateRangePicker startDate={moment('1/1/2014')} endDate={moment('3/1/2014')}>
        <button>Click Me To Open Picker!</button>
      </DateRangePicker>
    );
  }
}

@diego-betto
Copy link
Contributor

temporarily fixed by changing

import * as DateRangePicker from 'react-bootstrap-daterangepicker';

to

const DateRangePickerImport = require('react-bootstrap-daterangepicker');
const DateRangePicker = DateRangePickerImport.default;

@skratchdot
Copy link
Owner

closing this due to inactivity. please re-open if this is still an issue in v6.0.0 or greater

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants