Updates on using Ionic/Stencil with Vite

[darrylnoakes]

For developers using Ionic Framework, we do have plans to use this custom elements output, but we will be doing that (at least for Vue initially) in Framework v6.

Originally posted by @liamdebeasi in #2827 (comment)

(I cannot post on the original Issue as it has been "locked and limited to collaborators".)

Any news with this?
I was getting the same issue, which I resolved (mostly) by upgrading from @ionic/vue from 5.4.0 to next (I assume a v6 beta).
In the browser, I now just get CSS map file 404 warnings (which I got with Ionic 5.4.0 + Vite as well, but not Ionic 5.4.0 + Vue CLI) instead of a wall of red errors.

On the command line, I now get just this, instead of a bunch of semi-fatal errors:

4:16:16 PM [vite] warning: 
D:/[REDACTED]/node_modules/.vite/chunk-PBLCSFVJ.js
1837|      return module[exportName];
1838|    }
1839|    return import(
   |                  ^
1840|      /* webpackInclude: /\.entry\.js$/ */
1841|      /* webpackExclude: /\.system\.entry\.js$/ */
The above dynamic import cannot be analyzed by vite.
See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.        

  Plugin: vite:import-analysis
  File: D:/[REDACTED]/node_modules/.vite/chunk-PBLCSFVJ.js?v=13a8507c

As far as I can make out, it works, and Vite is epic, but I'm not fully comfortable with using Ionic 6 Beta without knowing a bit more about its status.

[johnjenkins]

give this a +1 :D

[splitinfinities]

Yes, please signal boost @johnjenkins PR please!