Fall 1vue-cli erstellt das vue3-Projekt, lädt das Projekt auf den Linux-Server hoch, installiert Node auf dem Server und startet das Vue-Projekt. Erstens gibt es lokal ein Vue-Projekt, auf das nach dem Start normal zugegriffen werden kannNach der lokalen Verpackung können Sie auch direkt darauf zugreifenWenn die Seite index.html nach dem Verpacken leer ist, müssen Sie im Stammpfad des Projekts eine neue vue.config.js erstellen und diese erneut verpacken.Installieren Sie nodejs auf einem Linux-Server. Weitere Informationen finden Sie unter# Laden Sie das komprimierte Node-Paket herunter. Der Pfad, in dem der Befehl ausgeführt wird, ist der Pfad, in dem der Download erfolgt. wget https://npm.taobao.org/mirrors/node/v12.16.1/node-v12.16.1-linux-x64.tar.gz # Schneiden Sie das komprimierte Paket in den Pfad /usr/local/bin/ und dekomprimieren Sie es tar -xvf node-v12.16.1-linux-x64.tar.gz # Ändern Sie den Ordnernamen in NodeJs mv node-v12.16.1-linux-x64 NodeJs # Installieren Sie gcc yum installiere gcc gcc-c++ # Es gibt drei Dateien im Pfad /usr/local/bin/NodeJs/bin: node npm npx # Legen Sie Softlinks für diese drei Dateien fest. Das Verzeichnis /usr/bin wird zum Speichern von Systembefehlen verwendet. Zu diesem Zeitpunkt entspricht das Ausführen von Node in einem beliebigen Pfad dem Ausführen der Datei im Pfad /usr/local/bin/NodeJs/bin/node. Nach dem Ausführen von Node gelangen Sie in die Node-Umgebung. ln -s /usr/local/bin/NodeJs/bin/node /usr/bin/node ln -s /usr/local/bin/NodeJs/bin/npm /usr/bin/npm ln -s /usr/local/bin/NodeJs/bin/npx /usr/bin/npx # Wechseln Sie in das Stammverzeichnis cd # Knoten überprüfen Laden Sie das Vue-Projekt auf den Linux-Server hoch, kompilieren Sie es und führen Sie es aus# Geben Sie das Stammverzeichnis des Vue-Projekts ein cd /home/web # Abhängigkeiten installieren npm install # Kompilieren und verpacken Sie npm run build # Starten Sie das Projekt npm run serve prüfenFehlerzusammenfassungBeim Kompilieren des Projekts auf dem Linux-Server wird der folgende Fehler gemeldet, der darauf hinweist, dass die Knotenversion zu niedrig ist.Beim Kompilieren des Projekts auf dem Linux-Server wird der folgende Fehler gemeldet, der darauf hinweist, dass die Knotenversion 17.1.0 zu hoch istLösung, Referenz # Wenn Sie Node zuvor mit yum installiert haben, müssen Sie es deinstallieren und neu installieren. Die Installationsschritte finden Sie in der Installationsmethode mit „Quellpaket“ in diesem Blog. # Deinstallieren Sie nodejs yum entferne nodejs npm -y # Rufen Sie /usr/local/lib auf und löschen Sie alle Ordner node und node_modules. # Rufen Sie /usr/local/include auf und löschen Sie alle Ordner node und node_modules. # Rufen Sie /usr/local/bin auf und löschen Sie die ausführbaren Dateien von node. Wenn Sie beim Kompilieren oder Starten eines Projekts die Fehlermeldung "Unzureichende Berechtigungen" erhaltenLösung # Setzen Sie die Berechtigungen für die angegebene Datei chmod 777 /home/web/xxx Fehler beim Ausführen des Projekts: Warnungen, die möglicherweise mit der Option --fix behoben werden könnenLösung: Ändern Sie "lint": "vue-cli-service lint" in package.json des Projekts in: eslint --fix --ext .js,.vue src siehe Fall 2vue-cli erstellt das vue3-Projekt und legt die Dist-Datei nach dem Verpacken auf Tomcat ab Installieren Sie Tomcat auf einem Linux-Server# Verwenden Sie Docker, um den Tomcat-Container abzurufen. Docker Pull Tomcat # Starten Sie docker run -d -p 8080:8080 Tomcat im Hintergrund # Nach dem Start besucht der Browser http://192.168.0.102:8080/ und gibt 404 zurück # Lösung: # Öffnen Sie Port 8080 zur Außenwelt firewall-cmd --zone=public --add-port=8080/tcp --permanent # Starten Sie die Firewall neu, damit die Änderungen wirksam werden: firewall-cmd --reload # Geben Sie den Tomcat-Container ein docker exec -it Ausführen der Container-ID /bin/bash # Kopieren Sie alle Dateien im Verzeichnis webapps.dist in den Pfad webapps cp -r webapps.dist/* ./webapps # Löschen Sie das Verzeichnis webapps.dist rm -rf webapps.dist # Jetzt können Sie über den Browser auf die Tomcat-Seite zugreifen, aber das Tomcat-Bild zeigt nach dem Neustart immer noch 404 an. Sie müssen den aktuell geänderten Container als neues Bild übermitteln. # Beenden, ohne den Container anzuhalten Strg + P + Q # Senden Sie einen benutzerdefinierten Container im laufenden Zustand. tomcat10:10.1 ist mein benutzerdefinierter Imagename und meine Versionsnummer. docker commit -a="Author" -m="Notes" Die ID des laufenden Containers ist tomcat10:10.1 #Stoppen Sie den aktuellen Tomcat-Container. Docker stoppt die laufende Container-ID # Löschen Sie die Container-ID nach dem Ausführen von Docker RM # Starten Sie das Image, das Sie übermittelt haben docker run -d -p 8080:8080 tomcat10:10.1 # Ergänzung# Beim Starten des Tomcat-Image wird ein Fehler gemeldet: Treiber konnte externe Konnektivität am Endpunkt quirky_allen nicht programmieren # Fehlerursache: Port 8080 war beim letzten Start des Backend-Projekts belegt, daher muss das Backend-Projekt beendet werden. # Testen Sie dies, indem Sie http://192.168.0.102:8080 aufrufen und auf der Tomcat-Seite den erfolgreichen Start anzeigen. Legen Sie das gepackte Projekt in den Tomcat-Container# Erstellen Sie einen freigegebenen Ordner mkdir -p /home/mydocker/mytomcat8080/data # Container 8080 starten: Docker-Ausführung \ -p 8080:8080 \ --name mein-tomcat8080 \ -v /home/mydocker/mytomcat8080/data:/usr/local/tomcat/webapps \ -D \ Tomcat10:10.1 # Fehler beim Starten des Containers: Docker: ungültiges Referenzformat. # Fehlerursache: Der Docker-Befehl ist falsch geschrieben. Hier habe ich -v /home/mydocker/mytomcat8080/data:/usr/local/tomcat/webapps geschrieben \ Nach dem Doppelpunkt steht ein zusätzliches Leerzeichen # Rufen Sie das Stammverzeichnis des Vue-Projekts auf und generieren Sie nach dem Verpacken einen Dist-Ordner. Hier verwenden wir in Fall 1 immer noch das Projekt npm install npm-Ausführung erstellen # Kopieren Sie die gepackten Dateien nach Tomcat mv dist /home/mydocker/mytomcat8080/data #Starten Sie den Tomcat-Container neu. Docker startet die Tomcat-Container-ID neu. # Test, lokaler Zugriff http://192.168.0.102:8080/dist/ Damit ist dieser Artikel zum Bereitstellen von Vue-Projekten auf Linux-Servern abgeschlossen. Ich hoffe, dass es für jedermanns Studium hilfreich sein wird, und ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Div adaptive Höhe füllt automatisch die verbleibende Höhe
>>: Probleme bei der Konfiguration von https-Server und Reverse-Proxy mit Nginx unter Windows
Nach dem Docker-Lauf ist der Status immer „Beende...
Webanwendungsklasse 1. DownFürAlleOderNurIch Mith...
Inhaltsverzeichnis Vorwort Rollprinzip erreichen ...
Dieser Artikel gibt Ihnen den spezifischen Code v...
Wenn Sie das Idea-Entwicklungstool zum Debuggen v...
Natürlich gibt es auch viele Leute, die die gegent...
Projektszenario: Dark Horse Vue Projektmanagement...
Inhaltsverzeichnis 1. Isolationsstufe LESEN SIE U...
Windows Server 2019 ist das neueste Server-Betrie...
Google China hat ein Übersetzungstool veröffentlic...
Heute werde ich Ihnen einen Unterschied zwischen ...
Dieses Axios-Paket wird in der Vue3-Demo verwende...
Hier ist zu Ihrer Information eine Vue-Single-Sig...
Inhaltsverzeichnis 1. Wo ist die Langsamkeit? 2. ...
Vorwort Beim Teilen einer Seite hoffen Sie, durch...