Assets aren't linking to vite dev server, which results in a Rails 404 about vite_ruby

[ElMassimo]

Probably related to the latest version of Vite, which is a bit of a moving target:

(!) "build.base" config option is deprecated. "base" is now a root-level config option.
(!) "base" config option should start and end with "/".

I will release another version tomorrow targeting beta.44, moving build.base to base.

For now, try using vite: "2.0.0-beta.34".

[arcreative]

Seems like it might be working better... but I have to rewrite a lot of stuff to find out :-)

Thanks for the quick response, will let you know what I find out when I can dig into it a bit more.

[arcreative]

Thanks again for the prompt response! I wasn't aware of that import syntax--but it doesn't seem to work either. I'm also a bit concerned that it's not going to work for the vite build version of the app as well, since there isn't actually an export on default. I am using vite-plugin-vue2, since vite allegedly won't work without it, but this all seems like a bit too much going on to investigate at this point. Perhaps when vuetify goes to Vue 3 I can use Vue 3, then maybe this will all work out. Thank you for your time!

[ElMassimo]

Hey, thanks for reporting.

That null there suggests that there might be a missing configuration option.

Would you share your config/vite.json? Also, please run bin/rake vite:info and paste the result so that I can verify that you are not using a previous version.

The example app is also running 6.1.1, so it might be related to config.

[ElMassimo]

@arcreative Just released an update of vite_rails (1.0.11) and vite-plugin-ruby (1.0.5).

Please try using it with the latest vite (2.0.0-beta46), and let me know how it goes.

[arcreative]

@ElMassimo Any idea why I would be getting Vue.use is not a function when doing a standard import Vue from 'vue' and then trying to initiate a module? The import looks like the following (an object with default property that corresponds to what Vue should be):

[ElMassimo]

Hard to know without more context, but from what I see in the screenshot, it seems the object is an ES module (instead of the export).

Try doing the following:

import { default as Vue } from 'vue'

or

Vue.default.use(...)

If it works, then it means the module is not unwrapping as expected. Not sure what could cause that to happen (could be related to any Vite plugins you are using, in which case upgrading to their latest versions might be worth a try).

I have a working example with Vue here, but it's not using the default export from Vue.

---

If you switched to Vue 3, it might be that the API for use has changed.

If using Vue 2, it might be necessary to use a specific Vite plugin.

[ElMassimo]

Have an example running Vite with Vue 2, you can find the details in this pull request.