Key error shows internal code frames
オープン
まだ誰も着手していません。
DX
Impact: Regression
LogBox
Needs: Attention
Never gets stale
Tech: Bundler 📦
- 主要言語
- C++
- スター
- 127k
- フォーク
- 25.3k
- 平均マージ
- 1日 23時間
- マージ済み PR（30日）
- 4
説明
Description
In LogBox, when there's a key error from React, the code frame should point to the application code causing the issue, but in 0.73 (and maybe other versions) it points to the react-jsx-runtime:
The fix is to add '/node_modules/react/cjs/react-jsx-runtime.+\\.js', to the config here:
https://github.com/facebook/react-native/blob/main/packages/metro-config/index.js#L15
Really we should probably have all of '/node_modules/react/.+\\.js$', there.
Steps to reproduce
- trigger key error
- open logbox warning
- see wrong code frame
React Native Version
0.73.0
Affected Platforms
Runtime - Android, Runtime - iOS
Output of npx react-native info
No
Stacktrace or Logs
No
Reproducer
No
Screenshots and Videos
Above
コントリビューションガイド
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
調査の方向性
code-frame の設定が定義されている packages/metro-config/index.js の15行目付近から始めます。LogBox で主要なエラーを再現し、アプリケーションのソースの代わりにどの React ランタイムファイルが選択されているかを確認します。警告が内部の react-jsx-runtime ファイルではなくアプリケーションコードを指すようになれば完了です。
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- react, react-native
- 領域
- mobile, tooling
- issue の種類
- バグ
- 難易度
- 2/5
- 見積もり時間
- 1〜3時間
- 活発さ
- 停滞
- 明瞭さ
- 明確に書かれている
- 初心者へのやさしさ
- 45/100