простой способ интегрировать React в приложение Flask? - PullRequest
Новая
       1

простой способ интегрировать React в приложение Flask?

0 голосов
/ 07 мая 2020

Вот мой проект flask, в котором я пытаюсь получить файл реакции для работы.

enter image description here

In it, we have app.py, which contains the routes, and should be hitting index.html in the templates folder.

app = Flask(__name__)

@app.route("/stem")
# test channel
def qi():
    return render_template('index.html')

in the html, im simple running the script for App.js,

<!DOCTYPE html>

1 Ответ

1 голос
/ 06 июня 2020

Поскольку ваш компонент React находится в форме JSX, проблема, скорее всего, связана с тем, что JSX необходимо преобразовать в JavaScript, который читается браузером. Цепочки инструментов, которые вам, вероятно, нравятся, Create-React-App будут преобразованы для вас (с использованием Babel), но в Flask, насколько я знаю, вы должны справиться с этим самостоятельно.

С Flask есть Есть несколько руководств по созданию набора инструментов для интеграции с React, но если у вас уже есть довольно обширное приложение Flask, это может быть сложно.

Моим обходным путем было инициализировать NPM для проекта, установить babel -cli, предварительно преобразовать файлы JSX в JS, а затем связать страницу HTML с транспилированным файлом JS.

Вы можете установить, выполнив следующие команды: 

npm init -y
npm install babel-cli@6 babel-preset-react-app@3

Оттуда вы запускаете эту команду: 

npx babel --watch (jsdirectory) --out-dir (outputdirectory) --presets react-app/prod

где (jsdirectory) - это путь к каталогу, в котором находятся ваши файлы компонентов React, написанные с использованием JSX, а (outputdirectory) - это место, куда вы хотите перевести файлы для отображения - используйте. для (outputdirectory), чтобы преобразованные файлы отображались в вашем каталоге root.

После вывода файлов. js попытайтесь связать их со страницей HTML, как обычно, используя тег скрипта и он должен отображаться правильно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...