Technologieaustausch

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Inhaltsverzeichnis

Beispiellauf

Schritt 1. NPM-Installation

Schritt 2. npm run dev

Ersetzung der Softhang-Dokumentensteuerung

beigefügt

---

Vue-Anfänger werden die Ausführungsmethode des VUE-Beispiels für die Softhang-Dokumentsteuerung und den Ersetzungsprozess der Steuerelemente im Beispiel aufzeichnen.

Beispiellauf

Auf einem Computer, auf dem die VUE-Umgebung bereits installiert ist, können Sie einen anderen Artikel zur Bereitstellung der VUE-Umgebung lesen:Lösung für die NPM-Fehlerberichterstattung während der Konfiguration der VUE-Umgebung und beim Erstellen der VUE-Umgebung. Process_vue-Konfigurationsumgebungsfehlerberichterstattung – CSDN-Blog

Schritt 1. NPM-Installation

npm (vollständiger Name Node Package Manager) ist das offizielle Paketverwaltungssystem von Node.js, das die Funktionen zum Veröffentlichen, Erkennen und Installieren von Node.js-Modulen bereitstellt.

npm installieren

Wenn Sie npm install im Projektverzeichnis ausführen, das die Datei package.json enthält, liest npm die Datei und lädt sie automatisch herunter und installiert sie im aktuellen Projekt basierend auf den Modulen und ihren Versionsanforderungen, die in den Feldern „Abhängigkeiten“ und „devDependencies“ aufgeführt sind. im lokalen Verzeichnis node_modules.

Wechseln Sie in das Beispielverzeichnis, öffnen Sie das cmd-Befehlszeilenfenster und führen Sie npm install aus:

npm install Es kann Entwicklern auch dabei helfen, Konflikte zu lösen, die durch Änderungen der Abhängigkeitsversion verursacht werden.Wenn eine neue Version eines Moduls im Abhängigkeitsbaum veröffentlicht wird, führen Sie es erneut aus npm installnpm analysiert und installiert die neueste kompatible Version basierend auf Versionsbeschränkungsregeln, um die Konsistenz der Projektabhängigkeiten aufrechtzuerhalten.

Gleichzeitig wird während der Ausführung von npm install eine Sperrdatei (z. B. package-lock.json oder npm-shrinkwrap.json) generiert, mit der die genaue Version jeder Abhängigkeit gesperrt wird, die speziell vom Projekt verwendet wird. Auf diese Weise kann ein vollständig konsistenter Abhängigkeitsbaum in verschiedenen Entwicklungsumgebungen oder mehreren Installationen sichergestellt und so die Reproduzierbarkeit und Stabilität des Projekts verbessert werden.

Schritt 2. npm run dev

Nach der Installation der Projektabhängigkeiten können Sie versuchen, das VUE-Projekt auszuführen, indem Sie npm run dev im aktuellen Beispielstammverzeichnis des Befehlszeilenfensters ausführen, um das Beispiel zu starten.

npm run dev bezieht sich auf die Ausführung der Entwicklungsumgebung in einem node.js-Projekt. Was tatsächlich ausgeführt wird, ist der Befehl „dev“, der im Abschnitt „scripts“ der Datei package.json definiert ist:

Wie oben erwähnt, wird vue-cli-serviceserv ausgeführt, wenn npm run dev tatsächlich ausgeführt wird.

Unter normalen Umständen startet der Befehl „dev“ einen lokalen Server und überwacht Dateiänderungen. Bei Dateiänderungen wird die Seite automatisch aktualisiert, um Entwicklern die Debug- und Entwicklungsarbeit zu erleichtern. Führen Sie während des Entwicklungsprozesses einfach npm run dev aus, um das Projekt auszuführen. Anschließend aktualisiert sich das Projekt. Wenn die Datei während des Prozesses geändert wird, aktualisieren Sie sie einfach im Browser.

Ersetzung der Softhang-Dokumentensteuerung

SoftHang Document Control bietet einen Testzeitraum für die Demoversion von etwa einem halben Jahr. Wenn die Demoversion abläuft oder Sie sie bei SoftHang erwerben und das offizielle Produkt erhalten, müssen Sie die grundlegenden Informationen des Steuerelements im Projekt ersetzen.

Hier ist ein Logikdiagramm für den Steuerungsaustausch, das Sie von einem Softhang-Beamten erhalten haben:

Aus dem Flussdiagramm geht hervor, dass der Hauptzweck darin besteht, grundlegende Informationen wie Produktkabine und Klassifizierung zu ersetzen.

Im Beispiel von VUE ist der Ersetzungsprozess ähnlich. Suchen Sie zunächst den Codespeicherort, der auf das Soft Navigation-Steuerelement im Projekt verweist:

Nehmen Sie als Beispiel das VUE3.0-Beispiel, das ich erhalten habe:

In der Datei officecontrol:editindexcom.vue im Verzeichnis src/components werden die Informationen der Softhang-Dokumentsteuerung über das Objekt-Tag definiert, z. B. ID, Classid, Höhe und Breite, offizielle Produktautorisierungsinformationen usw.:

Der Codebasisteil des Beispiels wurde mit Anmerkungen versehen: Da die automatische Ladesteuerung des Browsers möglicherweise unerwartet nicht geladen werden kann, werden jetzt exe-Installationspakete für die Installation bereitgestellt, und es besteht keine Notwendigkeit dafür im Code. Schreiben Sie einfach die Klasseninformationen korrekt in den Code. Die klassifizierten Informationen stammen aus dem Inhalt der INF-Datei im Produkt-CAB-Paket, wie in der folgenden Abbildung dargestellt:

Verschiedene Taxis verfügen über unterschiedliche Informationen, daher müssen Sie darauf achten, sie zu unterscheiden. Wenn Sie es richtig schreiben, kann die Exe installiert werden. Wenn es falsch geschrieben ist, wird das Steuerelement möglicherweise nicht geladen.

Nachdem Sie die Steuerinformationen geändert haben, können Sie die Beispielseite im Browser aktualisieren, um die Auswirkung zu sehen.

beigefügt

Es gibt nicht viele Möglichkeiten, mit VUE in Kontakt zu kommen, und ich habe wenig gelernt. Ich werde einfach die Art und Weise aufzeichnen, wie das VUE-Projekt ausgeführt wird, und die verwendeten Dinge aufzeichnen.

Bei der im Beispiel verwendeten SoftHang-Dokumentensteuerung handelt es sich tatsächlich um eine Online-Bearbeitungssoftware für Office-Dateien. Mit dieser Software können Sie zugehörige Word-, Excel-, PPT- und WPS-Dateien direkt im Browser anzeigen und bearbeiten, sodass Sie diese nicht separat bearbeiten müssen. Es ist ein relativ umständlicher Vorgang, die Datei lokal herunterzuladen, sie dann zu ändern und sie dann über die Upload-Funktion im Geschäftssystem wieder auf den Server hochzuladen.

Okay, das war’s für heute. Lassen Sie mich zunächst einen Blick auf dieses Softhang-Dokumentenkontrollbeispiel werfen