2

我正在使用 react-create-app 构建一个 Web 应用程序，并希望使用烧瓶来提供它。前端是使用生成的

npx create-react-app frontend
cd frontend
npm run build

我的项目结构如下所示：

- backend
    - static
    - templates
    - app.py
- frontend
    - build
        - static
            - css
                ...
            - js
                ...
            - media
                ...
        - favico.ico
        - index.html
        - service-worker.js
        - ...
    - public
        ...
    - src
        ...
    - ...

应用程序.py

from flask import Flask, send_from_directory
import os


app = Flask(__name__, static_folder=r'..\frontend\build')


@app.route('/', defaults={'path': ''})
@app.route('/<path:path>')
def serve(path):
    if path != "" and os.path.exists("/static/" + path):
        return send_from_directory(app.static_folder, path)
    else:
        return send_from_directory(app.static_folder, 'index.html')


if __name__ == '__main__':
    app.run(use_reloader=True, port=5000, threaded=True, debug=True)

如果我正在运行 serve -s build 应用程序运行并且一切都很好。但是，运行 python app.py 会显示一个空白页面，并且 chromes 控制台会显示以下错误：

Uncaught SyntaxError: Unexpected token < 2.b41502e9.chunk.js:1
Uncaught SyntaxError: Unexpected token < main.4001340c.chunk.js:1 
Manifest: Line: 1, column: 1, Unexpected token. :5000/manifest.json:1

看起来浏览器无法解释 jsx 语法。我该如何解决这个问题？

4

2 回答 2

0

你安装了 Flask 吗？

npm install flask
于 2020-01-04T14:28:14.377 回答
0

刚刚自己解决了这个问题，实际上您实际上是在index.html为所有请求提供服务。html 也是如此*chunk.js，而不是 Javascript，因此您会收到语法错误。

这是因为以下原因：

if path != "" and os.path.exists("/static/" + path):

总是假的。/static/在这种情况下，这不是一条有意义的路径。

将其更改为：

if path != "" and os.path.exists(f"{app.static_folder}/{path}"):

它会工作得很好。

于 2020-08-18T01:08:41.040 回答