在本地使用完整堆栈(wamp)开发react

j5fpnvbx  于 2021-06-21  发布在  Mysql
关注(0)|答案(2)|浏览(415)

有没有办法在前端使用react和全栈服务器(例如wamp)来设置本地开发环境?
最好的情况是:
使用默认的react create app设置而不弹出脚本
对php文件进行ajax调用,处理对mysql数据库的查询
问题:
有没有可能只是在localhost:3000 and React yarn start 在localhost:3002 (它自动设置不同的ip),然后把php文件放在里面的某个地方 src 使用ajax技术(例如jquery或原生xmlhttprequest)从jsx中调用它们?
或者,唯一的方法是弹出脚本,然后构建文件并将其放入wamp中 /www/project 文件夹,然后使用自定义工具在wamp的localhost地址更新所有这些内容?
编辑:将react应用程序放入 /wamp/www 不是一个选择-这对我来说不起作用,我不想投入更多的精力。在localhost上运行react和wamp-in似乎有效,要回答的问题是:
如何将php文件导入jsx。试着用smth来称呼它,比如: require('./foo.php') 不起作用。 import foo from ./foo.php 也没用。有什么好主意?

v64noz0r

v64noz0r1#

经过调查,我找到了实现目标的方法。
能够将请求发送到您使用的任何本地服务器(apache、nginx、node.js)的关键是使用reactjs proxy 特点:
https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/readme.md#proxying-开发中的api请求
添加后 "proxy": "http://localhost" 对于我的package.json文件,我能够向我的wamp服务器发送和接收请求,同时保留所有react的create app本机脚本。
p、 事实证明,facebook有一个很好的react本地请求工具,名为 fetch - https://facebook.github.io/react-native/docs/network.html.

nxowjjhe

nxowjjhe2#

1) 我强烈建议您尝试这样做:分离关注点非常重要。为您的应用程序提供两个存储库,一个用于后端,另一个用于前端是非常重要的。尤其是如果您正在使用版本控制系统,更重要的是,如果您计划在团队中使用它。我建议您只需将wamp安装留在原处,添加一个vhost,如:backend.my-project.com,然后正常运行react应用程序,并使用cra文件中的env.local来使用环境变量存储后端应用程序的url。
2) 您无需弹出脚本即可将前端和后端放在同一位置:在wamp文件夹中创建react应用程序,或将wamp文件夹指向create reac app生成的react应用程序

相关问题