Javascript 如何在Wordpress页面上呈现React？_Javascript_Reactjs_Wordpress_Create React App

Javascript 如何在Wordpress页面上呈现React？

javascript reactjs wordpress

Javascript 如何在Wordpress页面上呈现React？,javascript,reactjs,wordpress,create-react-app,Javascript,Reactjs,Wordpress,Create React App,我正在尝试让React应用程序作为Wordpress页面的一部分呈现。我使用create react app创建了我的应用程序，并添加了 "homepage": "." 在构建之前，将其发送到package.json 起初，我通过在标准html文档中嵌入必要的核心文件来尝试该功能 <!DOCTYPE html> <html lang="en"> <head> <meta chars

我正在尝试让React应用程序作为Wordpress页面的一部分呈现。

我使用

create react app

创建了我的应用程序，并添加了

"homepage": "."

在构建之前，将其发送到

package.json

起初，我通过在标准html文档中嵌入必要的核心文件来尝试该功能

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

<div id="wp-root"></div>

<script src="runtime-main.363857b3.js"></script>
<script src="main.ef284662.chunk.js"></script>
<script src="2.319ef205.chunk.js"></script>

</body>
</html>

我还在同一个文件夹中添加了一个简单的测试脚本

alert（“test”）

，以确保它有响应

我的测试脚本按预期在每个页面上启动，因此我继续在页面上包含我的

，并在body标记下方的

header.php

中添加科学

我的测试脚本在

index.html

test中工作，我的React构建在

index.html中工作。



为什么Wordpress不渲染它？
创建react应用程序：3.4.1

wordpress:5.5.3

主题：Blankslate
成功了
如果我在
之前直接将脚本从远程主机加载到footer.php
，它就可以完美地工作
<?php wp_footer(); ?>
<script src="http://localhost/react_app/build/static/js/runtime-main.363857b3.js"></script>
<script src="http://localhost/react_app/build/static/js/main.ef284662.chunk.js"></script>
<script src="http://localhost/react_app/build/static/js/2.319ef205.chunk.js"></script>
</body>



我还尝试成功导入React CDN，但没有解决问题
这可能是wp\u enque\u脚本
工作方式的问题。在本例中，它只是忽略了所有的脚本exepttest.js
，这很有效
如果我在
之前直接将脚本从远程主机加载到footer.php
，它就可以完美地工作
<?php wp_footer(); ?>
<script src="http://localhost/react_app/build/static/js/runtime-main.363857b3.js"></script>
<script src="http://localhost/react_app/build/static/js/main.ef284662.chunk.js"></script>
<script src="http://localhost/react_app/build/static/js/2.319ef205.chunk.js"></script>
</body>



我还尝试成功导入React CDN，但没有解决问题
这可能是wp\u enque\u脚本
工作方式的问题。在本例中，它只是忽略了除test.js之外的所有脚本。Wordpress中是否有什么东西在默认情况下阻止了React中的某些东西Wordpress中是否存在阻止默认情况下反应的内容