Can I write an npm package compatible with preact and react?

[qwertie]

trafficstars

As I was typing npm install react, I thought to myself: I'm sure my package would be preact-compatible, but if anybody writes npm i mypackage they are going to get react as a dependency, which maybe they don't want. Is there a way I can publish this thing in such a way that it's compatible with both?

[marvinhagemeister]

Third party packages usually opt for one of the following ways to be compatible with react/preact:

1. Kepp importing react and tell users to overwrite react import via webpack aliasing
2. Publish dedicated preact entrypoint mypackage/preact
3. Publish a completely separate package mypackage-preact + mypackage-react

[qwertie]

Hmm, but if you go with option 1 or 2 - what do you do, mark React as an optional dependency?

[marvinhagemeister]

For all options you'd mark react or preact as a peerDependency. Otherwise the user would likely end up with multiple versions of (p)react

[developit]

You might find the technique shown here to be useful: https://jasonformat.com/universal-vdom-components-with-factory-loader/

[qwertie]

I don't think that technique would work in TypeScript (which I'm using) as the compiler would be unable to load the pseudo-module. And I doubt the technique could be used with Parcel (which I'm also using). Hmm...

[developit]

I've always wanted to release an npm package that tries to infer which virtual-dom library a given project is using. It'd be neat:

import { createElement, Component, cloneElement, render } from 'any-vdom';
// if you have preact installed you get the methods from preact
// if you have react installed you get its methods
// etc