如何将 React 和 material-ui 与烧瓶后端一起使用？答案

【问题标题】：How to use React and material-ui with flask backend?如何将 React 和 material-ui 与烧瓶后端一起使用？
【发布时间】：2020-06-17 05:51:59
【问题描述】：

我是 react 初学者。我只是想用 flask 后端和 react 前端用 material-ui 制作一个网络应用程序，但我在设置它时遇到了问题。

我做了什么

我从here 下载了 React 脚本。然后来自 CDN 的 material-ui 链接可用here 和来自here 的 babel。在为需要离线支持的本地网络进行开发时，我下载并自行托管了它们。

我的代码

index.html

<html>
    <head>
        <script src="/src/libs/babel.min.js"></script>
    </head>
    <body>
        <div id="root"></div>
    </body>
    <script src="/src/js/index.js" type="text/babel"></script>
</html>

index.js

import {React} from './src/libs/react.min.js';
import {ReactDOM} from './src/libs/react-dom.min.js';
import * as mui from './src/libs/material-ui.min.js';

ReactDOM.render(<mui.Switch />, document.getElementById('root'))

它几乎是空的，因为我只是在设置东西。

我面临的错误

Uncaught ReferenceError: require is not defined
    at <anonymous>:5:17
    at VH (babel.min.js:1)
    at a (babel.min.js:1)
    at s (babel.min.js:1)
    at XMLHttpRequest.HH.t.forEach.e.src.o.onreadystatechange (babel.min.js:1)

现在我不知道如何让这个 require 东西与 python 后端一起工作。有没有其他方法可以解决这个问题？即使所有代码都必须更改也没关系，因为它只是设置而没有实际代码。

【问题讨论】：

标签： javascript reactjs flask python-babel

【解决方案1】：

Babel 需要一些配置才能为 JSX 工作，并且它不支持生产环境中的浏览器。相反，我建议使用create-react-app。您需要做的就是创建一个应用程序并将您的index.js 复制到src，然后您可以使用build 命令为您的Python 后端获取静态HTML/JS/CSS 文件。

【讨论】：