<Fragment> tag does not render html in chrome nor throw any error in JSX Preprocessing
未关闭
还没有人认领这个 Issue。
- 主要语言
- JavaScript
- 星标
- 11.8k
- 派生
- 7.9k
- 平均合并
- 1 天 11 小时
- 30 天内合并 PR
- 11
描述
https://beta.reactjs.org/reference/react/Fragment#fragment
Doesnt throw error in jsx preprocessing(npx babel --watch sr --out-dir . --presets react-app/prod) for babel version:6.26 installed as per current official react install docs ,please have a check if new beta version supports.
Can be related to
#5532 ?
{/* index.html */}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Test Page-React</title>
</head>
<body>
<div id="Sc"></div>
<script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
<!-- Load your React component. -->
<script type="module" src="test.js"></script>
</body>
</html>
{/* test.js */}
{
const root9 = ReactDOM.createRoot(document.getElementById('Sc'));
const element9 = <Gallery />;
root9.render(element9);
function ProfileS() {
return (
<img
src="https://i.imgur.com/MK3eW3As.jpg"
alt="Katherine Johnson"
/>
);
}
function Gallery() {
return (
<Fragment>
<div>
<h1>Amazing scientists</h1>
<ProfileS /> {/* react component 1 */}
<ProfileS /> {/* react component 2 */}
<ProfileS /> {/* react component 3 */}
</div>
<div>
<ProfileS /> {/* react component 1 */}
<ProfileS /> {/* react component 2 */}
</div>
<div>
<Pile />
</div>
</Fragment>
);
}
function Pile() {
return (
<img
src="https://i.imgur.com/QIrZWGIs.jpg"
alt="Alan L. Hart"
/>
);
}
贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
调研方向
从 issue 中链接的 Fragment 参考开始，然后使用提供的 index.html 和配合 Babel 6.26 的 npx babel --watch 命令重现 test.js 中的示例。确认文档中的 Fragment 示例是否能使用 React 18 UMD 脚本进行渲染，并更新相关文档或报告已确认的不兼容性。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- javascript, react
- 领域
- documentation
- Issue 类型
- 缺陷
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 需要澄清
- 新手友好度
- 25/100