Ich sehe das gleiche Problem. Es hängt wahrscheinlich mit der Warnung zusammen, die angezeigt wird, wenn ionic serve :

warning  in ./node_modules/@ionic/vue/dist/ionic-vue.esm.js
"export 'ICON_PATHS' was not found in 'ionicons/icons'

Hier gilt das gleiche. Kann nicht frisch erstellte App bereitstellen.

Die Problemumgehung, die ich gefunden habe, besteht darin, zuerst zu installieren

npm install @ionic/core<strong i="6">@one</strong> 
npm install @ionic/[email protected]

Ändern Sie die Datei main.js

import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
//import Ionic from "@ionic/vue"; // comment this line 
import { defineCustomElements as ionic } from "@ionic/core/loader"; // add a direct link to @ionic/core
import { defineCustomElements as svgmorphing } from "stencil-svgpaths-morphing/dist/loader";

import "@ionic/core/css/ionic.bundle.css";

//Vue.config.ignoredElements = [/jeep-\w*/]; // comment this line
Vue.config.ignoredElements = [/^ion-/, /^jeep-/];   // add this line

//Vue.use(Ionic);  // comment this line
ionic(window); // add this line
svgmorphing(window);

Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

und behalten Sie die Datei router.js so wie sie es bedeutet, verwenden Sie weiterhin den IonicVueRouter

und es funktioniert gut.
Wenn Sie sich jetzt package-lock.json ansehen,

@ionic/core is version "4.6.0-dev.201906131724.645b9a9" requiring "ionicons": "4.5.9-1"
@ionic/vue is version 0.0.4 with dependencies @ionic/[email protected] requiring "ionicons": "4.5.10-2

Um die Symbole zu sehen, sollte die main.js sein:

import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import { defineCustomElements as ionic } from "@ionic/core/loader"; // added line
import { defineCustomElements as svgmorphing } from "stencil-svgpaths-morphing/dist/loader";

//import Ionic from "@ionic/vue"; // commented line
import { addIcons } from "ionicons"; // added line
import { ICON_PATHS } from "ionicons/icons"; // added line
import "@ionic/core/css/ionic.bundle.css";

//Vue.config.ignoredElements = [/jeep-\w*/];  // commented line
Vue.config.ignoredElements = [/^ion-/, /^jeep-/]; // added line

//Vue.use(Ionic); // commented line
ionic(window); // added line
svgmorphing(window);
addIcons(ICON_PATHS); // added line
Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

Jetzt werden die Icons angezeigt
Dies kann als Workaround verwendet werden, bis @ionic/vue auf @ionic/ core@one aktualisiert wird

Siehe für eine vollständige Implementierung

https://github.com/jepiqueau/vue-test-stencil-svgpaths-morphing/tree/ionicone

Ich stehe vor dem gleichen Problem. Kann nicht frisch erstellte App bereitstellen.

Hier gilt das gleiche

Vorübergehend,

• Allgemein alles, was mit Symbolen in dieser Datei zu tun hat (ionic-vue.esm.js, Chunk-Datei, die in der Konsole angezeigt wird)

Ich habe dies getan und die App hat für mich funktioniert, aber das ist nicht die richtige Lösung, aber Sie können dies jetzt tun, um Ihre Arbeit fortsetzen zu können

Wenn Sie diese Datei nicht finden können, gehen Sie in das Projektverzeichnis und suchen Sie in der Computer-/Lap-Suche nach dem Vornamen der Datei. (Wenn Sie nach ionic-vue.esm.js suchen, schreiben Sie -> ionic und es werden alle Dateien/Ordner angezeigt, die mit ionic begonnen haben, dann wählen Sie in diesem Fall die Datei aus, nach der Sie suchen (Sie sollten ionic-vue.esm.js wählen) .

Abdlrahmansabers Temp-Fix funktioniert,
(Er bedeutet "Kommentar" nicht "Allgemein") Sie möchten die Zeilen auskommentieren, die er in seinen Screenshots auskommentiert hat.

Danke Adrianmed :)

wahrscheinlich kenne ich den Grund für diesen Fehler

der Grund, weil wenn Sie versuchen, den {ICON_PATH} zu importieren, es nichts zurückgibt, versuchen Sie es in der Konsole zu drucken, es wird nichts zurückgeben.

@Adrianmed @Abdlrahmansaber ja, es funktioniert, aber töte die Symbole, also ist dies keine vorübergehende Lösung für eine veröffentlichte App :)

Ich habe die Lösung von @Abdlrahmansaber angewendet. Aber es funktioniert nicht richtig (die Kompilierungswarnung und der Konsolenfehler sind verschwunden).
Ich versuche dem zu folgen: https://ionicframework.com/blog/announcing-the-ionic-vue-beta/
Aber im Moment füge ich hinzu

import Ionic from '@ionic/vue';
import '@ionic/core/css/ionic.bundle.css';

Vue.use(Ionic);

zu main.js bekomme ich nur eine "leere" Seite.

Aktuelle Abhängigkeitsversionen:
"Abhängigkeiten": {
"@ionic/vue": "0.0.4",
"vue": "^2.6.10",
"vue-router": "^3.0.3"
},
"devDependencies": {
"@vue/cli-service": "^3.8.0",
"vue-template-compiler": "^2.6.10"
}

Ich habe die Lösung von @Abdlrahmansaber angewendet. Aber es funktioniert nicht richtig (die Kompilierungswarnung und der Konsolenfehler sind verschwunden).
Ich versuche dem zu folgen: https://ionicframework.com/blog/announcing-the-ionic-vue-beta/
Aber im Moment füge ich hinzu

import Ionic from '@ionic/vue';
import '@ionic/core/css/ionic.bundle.css';

Vue.use(Ionic);

zu main.js bekomme ich nur eine "leere" Seite.

Aktuelle Abhängigkeitsversionen:
"Abhängigkeiten": {
"@ionic/vue": "0.0.4",
"vue": "^2.6.10",
"vue-router": "^3.0.3"
},
"devDependencies": {
"@vue/cli-service": "^3.8.0",
"vue-template-compiler": "^2.6.10"
}

edit: Bei mir funktioniert es gut, sogar mit deinem zitierten Import

Du solltest das verwenden, was ich vor zwei Tagen vorgeschlagen habe, es funktioniert und du siehst die Symbole

@wannymiarelli Ich weiß, dass das Symbol behoben ist

und du hast recht, es ist keine lösung für veröffentlichte app

@mbilbao kannst du mir die Konsole zeigen?

Ich bekomme dies behoben, indem ich die ionicons-Version in package-lock.json ändere

Aber es sollte tatsächlich mit einer frischen npm-Installation funktionieren

@mbilbao kannst du mir die Konsole zeigen?

Hey, die Konsole war klar, ohne Fehler, Warnungen oder was auch immer beim Überprüfen des ausführlichen Modus angezeigt wird.
Ich habe das ionicons-Paket bereits heruntergestuft, wie von @daarioautumn gepostet und es funktioniert.
Danke @Abdlrahmansaber trotzdem.

Fügen Sie einfach [email protected] zu Ihrer package.json hinzu. Dies überschreibt nur jede Peer-Abhängigkeit und kann als Problemumgehung verwendet werden.

gleiches Problem... wie kann man es beheben?

Ich habe die Lösung von @Abdlrahmansaber angewendet. Aber es funktioniert nicht richtig (die Kompilierungswarnung und der Konsolenfehler sind verschwunden).
Ich versuche dem zu folgen: https://ionicframework.com/blog/announcing-the-ionic-vue-beta/
Aber im Moment füge ich hinzu

import Ionic from '@ionic/vue';
import '@ionic/core/css/ionic.bundle.css';

Vue.use(Ionic);

zu main.js bekomme ich nur eine "leere" Seite.

Aktuelle Abhängigkeitsversionen:
"Abhängigkeiten": {
"@ionic/vue": "0.0.4",
"vue": "^2.6.10",
"vue-router": "^3.0.3"
},
"devDependencies": {
"@vue/cli-service": "^3.8.0",
"vue-template-compiler": "^2.6.10"
}

@mbilbao Ich habe das gleiche Problem. Haben Sie eine Lösung gefunden?

Ich habe das gleiche Problem. Ich habe ein paar Stunden im Internet gesucht, um eine Lösung zu finden, aber ich habe keinen richtigen Weg gefunden, dieses Problem zu lösen. Kann mir jemand helfen?

Ich habe die Lösung von @Abdlrahmansaber angewendet. Aber es funktioniert nicht richtig (die Kompilierungswarnung und der Konsolenfehler sind verschwunden).
Ich versuche dem zu folgen: https://ionicframework.com/blog/announcing-the-ionic-vue-beta/
Aber im Moment füge ich hinzu

import Ionic from '@ionic/vue';
import '@ionic/core/css/ionic.bundle.css';

Vue.use(Ionic);

zu main.js bekomme ich nur eine "leere" Seite.

Aktuelle Abhängigkeitsversionen:
"Abhängigkeiten": {
"@ionic/vue": "0.0.4",
"vue": "^2.6.10",
"vue-router": "^3.0.3"
},
"devDependencies": {
"@vue/cli-service": "^3.8.0",
"vue-template-compiler": "^2.6.10"
}

@mbilbao Ich habe das gleiche Problem. Haben Sie eine Lösung gefunden?

Ja, ich habe die Lösung von @daarioautumn angewendet, nur das Ionics-Paket auf 4.5.8 heruntergestuft

@yasin-mesut Lösung funktioniert für mich

Installiere einfach das ionische Paket: npm install [email protected] --save-dev wie von @yasin-mesut vorgeschlagen

@jepiqueau Ihre

Sind Sie auf dieses Problem gestoßen? Weißt du, wie man es löst?

Ich bin gerade mit Angular auf normales Ionic umgestiegen. Aber ich möchte mein Projekt immer noch mit Vue Framework entwickeln traurig

Ich habe die Lösung von @Abdlrahmansaber angewendet. Aber es funktioniert nicht richtig (die Kompilierungswarnung und der Konsolenfehler sind verschwunden).
Ich versuche dem zu folgen: https://ionicframework.com/blog/announcing-the-ionic-vue-beta/
Aber im Moment füge ich hinzu

import Ionic from '@ionic/vue';
import '@ionic/core/css/ionic.bundle.css';

Vue.use(Ionic);

zu main.js bekomme ich nur eine "leere" Seite.

Aktuelle Abhängigkeitsversionen:
"Abhängigkeiten": {
"@ionic/vue": "0.0.4",
"vue": "^2.6.10",
"vue-router": "^3.0.3"
},
"devDependencies": {
"@vue/cli-service": "^3.8.0",
"vue-template-compiler": "^2.6.10"
}

@mbilbao Ich habe das gleiche Problem. Haben Sie eine Lösung gefunden?

Ja, ich habe die Lösung von @daarioautumn angewendet, nur das Ionics-Paket auf 4.5.8 heruntergestuft

Ich habe diesen Stil gefunden:

html:not(.hydrated) body {
    display: none;
}

Dies wird mit @ionic/ vue @

Könnte die neueste Version (@ionic/[email protected] ) auf npm veröffentlicht werden? jetzt in npm ist v0.0.4.

Es wird auf npm veröffentlicht do npm install --save @ionic/ vue@next

Die Lösung von @jepiqueau hat bei mir perfekt funktioniert. Dankeschön!!!

Es funktioniert in @ionic/ vue @
schließen, neu anordnen, Menü, Pfeil-vor, Pfeil-zurück, Pfeil-unten, Suchen & Kreis schließen.

Wann können wir hoffen, vollen Zugriff auf alle Symbole zu haben?

Natürlich kann man ionic-vue.esm.js bearbeiten, aber nicht sicher, ob dies der empfohlene Weg ist....

Die Lösung für andere Symbole besteht darin, sie in die Datei main.js einzufügen, dh für die Symbole "star","trash","create" machst du dies

// after import Ionic from "@ionic/vue"; 

import { addIcons } from "ionicons";
import { star, trash, create } from "ionicons/icons";

// after Vue.use(Ionic);
addIcons({
  "ios-star": star.ios,
  "md-star": star.md,
  "ios-trash": trash.ios,
  "md-trash": trash.md,
  "ios-create": create.ios,
  "md-create": create.md
});

Das ist es und es funktioniert, also tun Sie es für alle Symbole, die Sie verwenden möchten, sogar für das Symbol, das Sie einem Ionen-Element hinzufügen möchten
hoffe es hilft

Schauen Sie sich die Filiale ionicone von . an
https://github.com/jepiqueau/vue-test-stencil-svgpaths-morphing
Ich füge eine TestIcons-Schaltfläche in Home.Vue und eine TestIcons.Vue-Schaltfläche mit den gewünschten Symbolen hinzu

Es funktioniert gut. Danke für die Hilfe. Ist es eine vorübergehende Lösung oder ist der Weg zum Zugriff auf die Symbole der richtige Weg?

Ich kenne die Pläne des Ionic-Teams nicht, aber für mich ist es logisch, nur die Symbole zu importieren, die Sie in Ihrer App benötigen, anstatt alle Symbole, die die Größe Ihrer App ohne Wert erhöhen

Beachten Sie, dass Sie beim Importieren von Symbolen mit Bindestrichen im Namen, zum Beispiel log-out , stattdessen logOut im Import verwenden können.

import { addIcons } from "ionicons";
import { logOut } from "ionicons/icons";
addIcons({
  "ios-log-out": logOut.ios,
  "md-log-out": logOut.md
});

das ist der Weg

Wurde das gelöst?

Für Leute, die in Zukunft darauf stoßen, ist der Fix etwas oben begraben. Aktualisieren Sie einfach Ihre Version von @ionic/vue, zB:

$ npm install @ionic/[email protected]

@hunterloftis - danke. Das hat es getan. Ich hoffe, dass es offiziell aktualisiert wird, bevor ich zu Prod gehe, aber es funktioniert vorerst.

Danke Leute, ihr habt es mir wirklich leicht gemacht

Danke für das Problem! Dieses Problem wird gesperrt, um Kommentare zu verhindern, die für das ursprüngliche Problem nicht relevant sind. Wenn dies immer noch ein Problem mit der neuesten Version von Ionic ist, erstellen Sie bitte ein neues Problem und stellen Sie sicher, dass die Vorlage vollständig ausgefüllt ist.