Include a 'devServerIsRunning' variable

[stenvdb]

As stated in your blog post, there is an issue with static assets being referenced in CSS for example (https://nystudio107.com/blog/using-vite-js-next-generation-frontend-tooling-with-craft-cms#vite-processed-assets). A workaround could be to include a <base> tag to manually set the base url for all relative links. The tag should be set to the dev server if it is running or the PRIMARY_SITE_URL if it is not.

Since this could cause other issues, the best way would be to do this manually in your templates. So what would help is a way to check if the vite dev server is running in your templates. Something like:

{% if craft.vite.devServerIsRunning %}
<base href="{{ alias('@viteBaseUrl') }}">
{% endif %}

If you would made sure that you're using absolute paths for all assets or urls in a site, then this would fix relative paths in CSS or JS.

[khalwat]

Good idea, I'll roll that in.

[khalwat]

Implemented in 1.0.13 -> https://github.com/nystudio107/craft-vite/releases/tag/1.0.13

[khalwat]

@stenvdb I think we have a better solution as detailed here:

https://nystudio107.com/blog/using-vite-js-next-generation-frontend-tooling-with-craft-cms#vite-processed-assets

Issue ref: vitejs/vite#2394