search

ModusCreateOrg / ionic-vue

Vuejs integration for Ionic versions 4 and 5
MIT License
272 stars 26 forks source link

Using @modus/ionic-vue@1.3.6 with ionicons 5.0.0+ #118

Closed mattsteve closed 4 years ago

mattsteve commented 4 years ago

With Ionic 5+, this setup won't allow me to install older versions of ionicons because the dependency mismatch causes typescript problems.

ERROR in /home/project/node_modules/@ionic/core/node_modules/ionicons/dist/types/components.d.ts(64,13):
64:13 Interface 'HTMLIonIconElement' cannot simultaneously extend types 'IonIcon' and 'IonIcon'.
  Named property ''mode'' of types 'IonIcon' and 'IonIcon' are not identical.
    62 | 
    63 | 
  > 64 |   interface HTMLIonIconElement extends Components.IonIcon, HTMLStencilElement {}
       |             ^
    65 |   var HTMLIonIconElement: {
    66 |     prototype: HTMLIonIconElement;
    67 |     new (): HTMLIonIconElement;

While it appears the package.json for 1.3.6 lists @ionic/core 5.0.6, in practice I can't actually use it.

Ionic 5 requires Ionicons 5, and Ionicons 5 changed around some icon names. Ionic Vue is still referencing the "reorder" icon from Ionicons 4, which causes the webpack build to fail because they renamed it to "reorderFour", "reorderThree", etc.

Can you update the icon dependencies?

michaeltintiuc commented 4 years ago

It already is using the latest ionicons, have a look here: https://github.com/ModusCreateOrg/ionic-vue/blob/v1.3.6/src/index.ts#L52 You might need to remove your node_modules dir and reinstall, I'll give it a test on a fresh project just in case though

michaeltintiuc commented 4 years ago

Also 1.3.6 doesn't have a hard dependecy, but a peer one set to "@ionic/core": "^5.0.7"

mattsteve commented 4 years ago

You're right, I deleted node_modules and reinstalled & it works. My bad =(

michaeltintiuc commented 4 years ago

No worries, actually what you did made me discover that something went wrong during the build/release process of that version, I've pushed out 1.3.7 which should fix it. I tested it with the https://github.com/ModusCreateOrg/ionic-vue-examples repo and found out that the new overlay and input components weren't there, so pull the new version when you can, it also works with Ionic 5.1.0 btw. Thanks again @mattsteve