0

I've been stuck in an issue for 2 to 3 days. Issue

This is my package.json file

{
  "dependencies": {
    "autoprefixer": "^7.1.1",
    "babel-core": "^6.26.3",
    "babel-loader": "7.x",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-polyfill": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "blazy": "^1.8.2",
    "canvas-compress": "^1.1.5",
    "coffee-loader": "^0.7.3",
    "coffee-script": "^1.12.6",
    "compression-webpack-plugin": "^0.4.0",
    "css-loader": "^0.28.4",
    "extract-text-webpack-plugin": "^2.1.2",
    "file-loader": "^0.11.2",
    "file-saver": "^2.0.0-rc.3",
    "firebase": "^4.8.1",
    "glob": "^7.1.2",
    "google-libphonenumber": "^3.0.5",
    "jquery": "^3.2.1",
    "js-yaml": "^3.8.4",
    "moment": "^2.22.2",
    "node-sass": "^4.9.2",
    "node-zopfli": "^2.0.2",
    "numeral": "^2.0.6",
    "path-complete-extname": "^0.1.0",
    "postcss-loader": "^2.0.5",
    "postcss-smart-import": "^0.7.4",
    "precss": "^1.4.0",
    "prop-types": "^15.5.10",
    "rails-erb-loader": "^5.0.2",
    "react": "^15.6.0",
    "react-autosuggest": "^9.3.2",
    "react-avatar-editor": "^11.0.4",
    "react-calendar": "2.11.0",
    "react-cropper": "^1.0.0",
    "react-datepicker": "^1..0",
    "react-dom": "^15.6.0",
    "react-dropzone": "^3.13.4",
    "react-infinite-scroller": "^1.1.4",
    "react-onclickoutside": "^4.9.0",
    "react-primitives": "^0.4.3",
    "react-select": "^2.0.0",
    "react-slick": "^0.14.11",
    "react-styled-select": "^1.1.0",
    "react-svg-inline": "^2.0.0",
    "react-timeago": "^3.4.3",
    "react-visibility-sensor": "^4.1.1",
    "react-waypoint": "^7.0.3",
    "react_ujs": "^2.2.0",
    "reactive-state": "^0.5.8",
    "resolve-url-loader": "^2.0.2",
    "sass-loader": "^6.0.5",
    "select2": "^4.0.6-rc.0",
    "shallowequal": "^1.1.0",
    "smart-app-banner": "^1.5.1",
    "string": "^3.3.3",
    "style-loader": "^0.18.2",
    "url-polyfill": "^1.1.0",
    "validator": "^10.7.1",
    "webpack": "^2.6.1",
    "webpack-manifest-plugin": "^1.1.0",
    "webpack-merge": "^4.1.0"
  },
  "devDependencies": {
    "aglio": "^2.3.0",
    "babel-preset-stage-3": "^6.24.1",
    "react-file-base64": "^1.0.3",
    "react-images-upload": "^1.1.1",
    "react-pace-progress": "^1.0.2",
    "webpack-dev-server": "^2.4.5"
  }
}

This is how I'm importing the date picker:

import DatePicker from 'react-datepicker';

This is how I'm using it in render function:

<DatePicker 
   customInput={<WinDateInput />}
   ref="expiryDate"
   selected={expiryDate} 
   onChange={this.onChangeDate} 
   minDate={moment().add(1, 'day')} 
   dateFormat="YYYY/MM/DD" 
   id="registration_expiry_date"
/>

When I remove the props it doesn't work, but when I remove the whole component everything works as expected. I tried to remove the package-lock.json & node_modules and re-run the npm install but still doesn't work.

Node Version is : v8.11.3 NPM Version is: v6.4.1

dferenc
  • 7,918
  • 12
  • 41
  • 49
  • 1
    Please post your error in your question, not as an image link. Additionally, please take the time to properly format your question if you expect people to help you. Furthermore, please post more code — it's difficult to diagnose what's wrong based on what you've posted. – Colin Ricardo Nov 16 '18 at 12:16

2 Answers2

0

Check how you import the firebase

import firebase from 'firebase/app'
import 'firebase/app'
import 'firebase/auth'
import 'firebase/firestore'

Also this issue post

https://github.com/firebase/firebase-js-sdk/issues/848

Because lack of information, I assume the warning in the image and the error are related

Nikko Khresna
  • 1,024
  • 8
  • 10
0

React-datepicker requiers atleast react & react-dom version 16.0.0 or above you are using 15.x.x please update.