Wie kann ich NPM-Pakete mit Flask bedienen?

Question

Ich habe eine , die derzeit jQuery und highlight.js von externen Servern bezieht. Ich möchte diese lokalen Abhängigkeiten machen, die ich über NPM hereinziehe.

Was ist die Standardpraxis dafür? Sollte ich package.json Datei im selben Verzeichnis wie meine static und templates Verzeichnisse erstellen und node_modules als separate statische Dir Ala diese question dienen?

Ich verpacke und verteile meine App mit pip, also muss jede Lösung damit kompatibel sein.

Answer 1

Sie benötigen Bower und Sie haben bereits NPM. Das ist alles, was Sie brauchen, um zu erreichen, was Sie wollen.

Im Grunde müssen Sie eine package.json im Stamm erstellen, um Bower mit NPM zu installieren. Dann müssen Sie eine bower.json erstellen, um zu definieren, was alle Bibliotheken benötigen, beispielsweise jQuery.

Dann wird Ihr Fluss wie:

npm install 
bower install 

Dies wird grundsätzlich Bower installieren für Sie und die anderen Frontend-Bibliotheken, die Sie in bower.json definiert.

Alle Bower-Komponenten werden in einem Verzeichnis namens bower_components in Ihrem Stammverzeichnis abgelegt. Hier werden alle installierten Bower-Pakete gespeichert. Sie können diese Pakete jetzt in Ihren Vorlagen verwenden.

Auch see this, um sicherzustellen, dass Bower Pakete in Ihrem static oder assets Ordner, den Sie dienen möchten, installiert sind.

Answer 2

vielleicht ein bisschen für die Antwort zu spät, aber der einfachste Weg, es zu tun ist, um dies zu tun:

sudo npm install bower 
echo "bower_components/" >> .gitignore 
bower install -S (here goes whatever you want) 
npm init 

Sie dann die Aufforderung ausfüllen, und Sie werden ein paar neue Dateien haben:

• bower.json, die von bower erzeugt wird, um Abhängigkeiten zu verwalten. Mit bower install -S (your dependency) wird diese Datei mit Ihre neuen Abhängigkeiten aktualisieren.
• package.json, von npm erstellt Ihr Projekt und npm Abhängigkeiten
• node_modules, die Dinge, die Sie mit npm
• bower_components/ installiert zu verwalten, welche leben, wo alle Ihre Front-End-Abhängigkeiten ist.

Answer 3

Gehen Sie zu Ihrem statischen Ordner und initialisieren Sie dort Ihr npm-Projekt.

cd flask_app/static 
$ npm init 

nach der Installation und Speichern npm Pakete, die Sie sie so dienen kann:

<script src="{{ url_for('static', filename='node_modules/toastr/toastr.js')}}"></script> 

Credits: https://codeburst.io/creating-a-full-stack-web-application-with-python-npm-webpack-and-react-8925800503d9