Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

react-jsx does not work with Preact

オープン
#857 コメント 4 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
35/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
停滞
技術スタック
javascript, typescript

調査の方向性

まず、報告されている tsconfig オプションと microbundle のビルドを使って失敗を再現し、その後、microbundle が JSX の設定を TypeScript にどのように渡しているかを調べます。jsxImportSource に preact を設定した react-jsx が、競合する jsxFactory または fragment-factory エラーを発生させなくなれば、Issue は完了です。

索引モデルが issue の本文から書いたものです。

説明

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",
    //...
  }
}
主要言語
JavaScript
スター
8.1k
フォーク
358
PR マージ指標
30日以内にマージされた PR はありません

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

developit/microbundle のほかの issue

developit/microbundle の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。