Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

react-jsx does not work with Preact

Open
#857 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
javascript, typescript
Domain
build-system, tooling

Research direction

Start by reproducing the failure with the reported tsconfig options and a microbundle build, then inspect how microbundle passes JSX settings to TypeScript. The issue is done when react-jsx with jsxImportSource set to preact no longer triggers the conflicting jsxFactory or fragment-factory errors.

Written by the indexing model from the issue text.

Description

TypeScript

Hi

Error

I've recently made the switch to microbundle for a project that uses Preact and TypeScript.
Following the docs, and me having the latest version of TypeScript, I put the following in my tsconfig:

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact",
    //...
  }
}

However when building with microbundle I get the following error:
rpt2: options error TS5089: Option 'jsxFactory' cannot be specified when option 'jsx' is 'react-jsx'.
This seems weird behaviour as I have not specified the jsxFactory.

Combined with this I also get an error about the 'jsxFragmentFactory' having to be provided to use JSX Fragments, but I presume that is due to the fact the the jsxFactory is somehow incorrect.

I tried hardcoding the values from the config in my script (without success) by doing the following

microbundle --jsx react-jsx --jsxImportSource preact

Possible solution

I've been able to get microbundle working if I switch back to the tsconfig for older versions of TypeScript, so I'll be opting into this behaviour for now. For reference this is what the old config is:

{
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "h",
    "jsxFragmentFactory": "Fragment",
    //...
  }
}
Dominant language
JavaScript
Stars
8.1k
Forks
358
No merged PRs in 30d

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from developit/microbundle

All issues in developit/microbundle

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.