Wie mache ich mit vue ein Projekt zum Thema Erholung? Sie können mit vue-cli ein Vue-Projekt im Verzeichnis mit dem Django-Projekt erstellen. Wenn wir zu Garnbau gehen und es eingeben, werden wir beim Beenden in das dist-Verzeichnis index.html files und in die css- und js-Verzeichnisse gebracht. Ja, CSS und JS können statisch gesetzt werden und eine Vorlage aus index.html erstellen.
Durch Hinzufügen der Unterverzeichnisse static / frontend und templates / frontend sowie der Dateien __init__.py und urls.py zu dem Verzeichnis mit dem Frontend (wir haben es beispielsweise Frontend genannt) können wir INSTALLED_APPS Frontend hinzufügen. In urls.py ist so etwas wie
path('', TemplateView.as_view(template_name='frontend/index.html'), name='frontend-index'), ausreichend
path('', TemplateView.as_view(template_name='frontend/index.html'), name='frontend-index'),Damit die Dateien dort ankommen, wo sie zusammengestellt werden mussten, korrigieren wir den Build in package.json auf
"vue-cli-service build && (rm -rf static/frontend/ 2>/dev/null || true) && sed 's/=\\//=\\/static\\/frontend\\//g' dist/index.html > templates/frontend/index.html && mv dist static/frontend"
"vue-cli-service build && (rm -rf static/frontend/ 2>/dev/null || true) && sed 's/=\\//=\\/static\\/frontend\\//g' dist/index.html > templates/frontend/index.html && mv dist static/frontend"
Gleichzeitig reparieren wir die Wege mit sed.
Um alles zu automatisieren, habe ich
django_vue_generator gemacht . Es werden die Verwaltungsbefehle start_frontend und build_frontend hinzugefügt. Aber das ist noch nicht alles! Es generiert automatisch Formulare mit Validierung auf dem Client von Ihren Serialisierern. Und er erstellt Komponenten mit Formularen für das Viewset DRF-Projekt. Und die Listenkomponenten sind für sie gleich. Mit Paginierung und Filtration.
Die Listenansicht kann über Slots neu definiert werden.
Enthalten ist ein Demo-Projekt mit der Datei run.sh, das alles sammeln soll, was Sie brauchen.