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

Improved Preact integration #1

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Improved Preact integration #1

wants to merge 1 commit into from

Conversation

pago
Copy link
Owner

@pago pago commented Nov 27, 2020

Description

Preact offers a plugin system that enables us to tap into certain parts of it.
We leverage the vnode event to wrap any function component into a Reactive Component.

This integration removes the need to configure the JSX factory or importSource when using @pago/reactive with Preact.

To enable the behaviour, the user will have to either:

Option A:

Use a side effect import to install the Preact plugin.

import "@pago/reactive/preact";

Option B:

Use @pago/reactive/preact instead of @pago/reactive when importing any function.

import { ref } from "@pago/reactive/preact";

Option C:

Configure an alias from @pago/reactive to @pago/reactive/preact.

Question

Is this type of integration preferable over configuring the jsxImportSource? Or would it be preferable to stick to one-size fits all and have the same type of integration for React and Preact with no special casing for now?

Preact offers a plugin system that enables us to tap into certain parts of it.
We leverage the `vnode` event to `wrap` any function component into a Reactive Component.

This integration removes the need to configure the JSX factory or importSource when using `@pago/reactive` with Preact.

To enable the behaviour, the user will have to either:

Option A:
Use a side effect import to install the Preact plugin.

```
import "@pago/reactive/preact";
```

Option B:
Use `@pago/reactive/preact` instead of `@pago/reactive` when importing any function.

```
import { ref } from "@pago/reactive/preact";
```

Option C:
Configure an alias from `@pago/reactive` to `@pago/reactive/preact`.
import { wrap } from '../';
export * from '../';

const map = new WeakMap();
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tsdx is limiting me a bit too much when setting up additional entry points. Need to drop it at some point.

For now I manually copied the code for the ESM and CJS version. But that's basically the integration with Preact.

@github-actions
Copy link

size-limit report 📦

Path Size
dist/reactive.cjs.production.min.js 1.77 KB (0%)
dist/reactive.esm.js 1.85 KB (0%)

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

Successfully merging this pull request may close these issues.

None yet

1 participant