Javascript React.js：如何在新选项卡中加载应用程序组件？

我正在使用React.js构建一个新的web应用程序。我有一个欢迎页面（index.html），它是使用普通的旧html和CSS静态构建的

在欢迎页面中，我有一个“开始”按钮，单击该按钮，我将在一个新选项卡中打开一个新的html页面，在那里我需要加载我的React web应用程序

我看到的所有示例都直接在index.html页面中加载React应用程序。有人能告诉我如何在从static index.html页面启动的新页面中加载React应用程序吗

---

谢谢。

您可以通过指向react应用程序公共目录中的manifest.json文件并将“start\u url”键更改为您想要的任何文件来更改react应用程序的起点

---

然后将您的

ReactDOM.render（，el）

更改为您希望在新的起点文件中使用的任何元素。

有两种方法可以实现此目的：

方法1-使用npm运行弹出（不推荐）

以下是将React应用程序的起点从“index.html”更改为“App.html”的步骤：

$npm运行弹出

$vim./config/path.js

将此行更新为：“appHtml:resolveApp（'public/app.html'），”

$vim node_modules/html网页包插件/index.js

将此行更新为：“文件名：'app.html'”

方法2-编辑反应脚本文件

然而，Facebook建议不要退出，因为开发人员很难让自己的构建脚本保持最新，也很难自己管理整个构建过程。他们鼓励开发者使用CreateReact应用程序。推荐的方法是分叉createreact应用程序代码，更新react脚本包，将新脚本发布回npm，然后使用刚刚发布的createreact应用程序的这个新自定义版本

已发表的许多文章都说明了这一过程：

出于我的目的，我认为即使发布新的自定义版本也太过分了。因此，在不弹出或创建CRA自定义版本的情况下，我可以通过执行以下操作来实现这一点：

将./node\u modules/react scripts/config/path.js中出现的所有'index.html'替换为'app.html'

将./node_modules/html网页包plugin/index.js中的“filename:index.html”替换为“filename:app.html”

---

这样，您就可以继续接收来自Facebook的更新，而无需自行管理所有构建脚本。然而，我认为这样做的缺点是，每次有更新时，我们的更改可能会被新的更改覆盖，这将是一个突破性的更改。因此，每当代码因新的更新而中断时，我们都必须更新上述两个文件。但是考虑到保留create react应用程序的优点，我认为其优点大于缺点。

谢谢您的回答。但是当我这样做的时候，我得到了一个错误：“错误：目标容器不是DOM元素。”这是因为即使我修改了start_url，看起来它仍然在尝试将应用加载到index.html中。除了上述内容，我还有什么需要做的吗？谢谢。你能分享更多关于你改变了什么的细节吗？我的改变是：1。manifest.json：“开始url”：“/app.html”，2。在公共目录3中添加了一个新的“app.html”文件。在“index.html”中，添加了一个指向“app.html”文件的链接，app.html也有DOM元素，因此这不是问题。另一个解决方案是：希望此解决方案可以正常工作！）