时间戳

首页 > 解决方案 > 在 PHP 应用程序中捆绑 React 文件？

php - 在 PHP 应用程序中捆绑 React 文件？

问题描述

我正在开发一个 PHP HRM 系统并尝试集成在 React 中开发的资源调度程序。我使用 Webpack 将所有 JS 和 CSS 捆绑在单独的文件中。

简化的文件夹结构：

admin
  -index.php
scheduler (react's part)
  -bundled.js
  -bundled.css

我需要实现的是包含那些捆绑的文件以显示在 index.php 中，它位于 React 的目录之外（显然）。我正在考虑将它们包括如下：

索引.php：

<!DOCTYPE html>
    <html lang="en">
    <head>
        <title>React Big Scheduler Examples</title>
    </head>
    <body>
    <div>
        <div id="root"></div>
    </div>
    <link rel="stylesheet" type="text/css" href="../scheduler/bundled.css">
    <script type="text/babel" src="../scheduler/bundled.js"></script>
    </body>
    </html>

捆绑的.js：

import React, {Component} from 'react'
import {render} from 'react-dom'
import {HashRouter as Router, Route} from 'react-router-dom'
import Basic from './Basic'
import Locale from './Locale'
etc imports....

render((
    <Router>
        <Route exact path="/" component={Basic}/>
        <Route path="/readonly" component={Readonly}/>
        <Route path="/locale" component={Locale}/>
        <Route path="/views" component={Views}/>
        etc routes....
    </Router>
), document.getElementById('root'))

捆绑的.css

body {
   backgroud-color: grey;
}

etc styles....

正如我在开发人员工具中测试的那样，路径是正确的，控制台中没有显示任何错误。寿，在 index.php 中
没有渲染任何内容。<div id="root"></div>

任何帮助将不胜感激！

标签： phpreactjswebpack

解决方案

推荐阅读