简体   繁体   中英

ES6 Import errors with React Router

I am getting errors that are confusing enough that I have no idea where to look for solutions, and which are concerning because they seem to be hidden away deep in libraries.
I am working with a boilerplate app ( react-boilerplate ) and a forms library ( react-final-forms , react-final-form-arrays ) -- and the errors and odd behavior is caused when importing. Reproducible steps as follows.

  1. from a state where the app is working fine:
  2. import { FieldArray } from 'react-final-form-arrays' to my HomePage
  3. On hot reload, re-render of HomePage fails, so header and footer are displayed but HomePage doesn't re-render, but there are NO errors on console. same result if refresh page
  4. Navigate to another page and then navigate back to HomePage -- now using router -- and that throws the error(note the import isn't being used on page yet):

react.development.js?72d0:207 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of LoadableComponent . in LoadableComponent (created by Route) in Route (created by App) in Switch (created by App) in div (created by Context.Consumer) in StyledComponent (created by App__AppWrapper) in App in Router (created by ConnectedRouter) in ConnectedRouter (created by Connect(ConnectedRouter)) in Connect(ConnectedRouter) in IntlProvider (created by LanguageProvider) in LanguageProvider (created by Connect(LanguageProvider)) in Connect(LanguageProvider) in Provider

  1. remove import, everything back to normal.

The questions around curly brace imports are usually answered that its as simple as the difference between named and default imports. something clearly is more complicated here. (I have tried both, but its definitely supposed to be named). Is the problem related to loading scripts?

after banging head against wall for 3 hours, it was a versioning issue. npm install by default installed an older version of one of the dependencies than was needed. probably can close this question

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM