Closed rokrupnik closed 2 years ago
Hello @rokrupnik your code is just erroring at the line 34 of main.js:
components[name] = modules[path].default
Maybe check what "modules[path]" is in your case console.log(modules[path])
Still, you can always import manually as delete this auto import thing:
import HelloWorld from './components/HelloWorld.vue'
const components = {
HelloWorld,
}
HMR works fine when editing JS and CSS. The liveReload will only kick in if PHP files are edited.
Thanks for the fast reply! I followed your suggestions but found nothing out of the order. The console.log
in main.js
displayed the component being properly imported.
Even if I switched to manual imports the situation remained the same - HMR working in simple PHP files, not working when the page was rendered by PHP framework.
I guess I'll go along with liveReload
workaround and live with that. Thanks again for the setup and the help!
As last resort check if you have latest Node version. It sounds weird but on another issue that was the case.
Also check on Typescript side, seams you are using it.
But anyway don't give up too soon on HMR, it has nothing to do with Zend framework, it should be something else.
I have a Wordpress setup here, if it helps: https://github.com/wp-bond/boilerplate
If anyone comes across this - I did some debugging and finally found the cause and a workaround for this (Vite version 2.7.10
).
Cause: in vite client code (I was looking at dist version: vite/dist/client/client.mjs
), in fetchUpdate
function, line await Promise.all(Array.from(modulesToUpdate).map(async (dep) => {
, the Array.from(modulesToUpdate)
actually returned an empty Array instead of an Array of modules (and their paths) to update.
Workaround: I replaced the Array.from
call with a spread operator. The before mentioned line becomes: await Promise.all([...modulesToUpdate].map(async (dep) => {
I checked Vite issues and tried to start a PR for Vite, but I got stuck, since I don't own a private computer and I can't do the stuff required for a PR on my work computer (IT restrictions). If someone with same issue has the resources to do so, it would be nice to alert the Vite team.
Hi, great setup, thank you for preparing this!
I have one issue though - when I set this up in Zend framework (Magento 1), HMR update fails with the following error (ignore the 404 for the image...):
This doesn't happen if I set up the files in the same way as you did (simple php files). Then it works perfectly!
The URL in the framework looks like
https://<host>/eng/<page-with-vue-component>
but I see no other differences in the setup.Does anyone have any idea on how to handle this? I saw the workaround with
liveReload
on thesrc
files, but if possible, I would prefer to use HMR :)