Are components bundled with an older version of react compatible with its future versions?

Viewed 332

I've got a component library package* that uses styleguidist and other custom features, that allows me to re-use certain presentational/dumb components across different applications.

These are built, tested and imported and used in different projects that use React v16 with success.

Recently tried to include the package in a React v15 project, but fails; There's no error but the DOM presents an "<undefined></undefined>":

import { Foobar } from '@privatePackage/packageFoobar'

<Foobar /> 

renders:

<undefined></undefined>

Ideally, I'd update the legacy project to a recent version of React and set peerDependencies in the original source to prevent bundling React in the package* for distribution. Also, have 'React' in devDependencies for development.

"peerDependencies": {      
    "react": ">=16.x",
    ...
},
 "devDependencies": {      
    "react": ">=16.x",      
    ...
}

So, is it correct to think that components bundled with an older version of React are not compatible with future versions? Or is bundling React in the distribution files the reason why this would not work? I understand is not a good practice bundling 'React', instead should have as a peerDependency, but for the legacy project would be ideal for now not to update React because of API changes etc related with most packages in the project.

Update

As mentioned above, it's not a good practice to attempt to use different React version against each other even if bundled separately, where in the case above the Component is imported from a project that uses the most recent React version and then imported into an older version. It fails and it's supposed to fail.

To solve this, the legacy project packages need to be updated individually and solve any API changes, etc. Afterwards, the lower level package (the component library*) should have the react dependencies in both peerDependencies and also development.

0 Answers
Related