Laravel Mix HMR not updating after compiling - node.js

I have Laravel Mix 4.0.13 installed.
npm run watch works great, and running npm run hot it does seem to compile and detect my changes, recompiling.
However, nothing changes in the browser. In the console I see:
[HMR] Waiting for update signal from WDS...
[WDS] Hot Module Replacement enabled.
And after compiling, I get the following message twice, every time I compile:
[WDS] App updated. Recompiling...
I assume there needs to be another message that says reloading or something?
Another strange thing, if I try to refresh the page, it never loads anything from localhost:8080. It just sits there waiting indefinitely. I have to restart npm run hot and then reload the page.
Both JS/Vue and SASS doesn't reload in the browser.

You probably use .version() in your mix file.
Like in the docs, versioning in development is not very useful, so you could;
if (mix.inProduction()) {
mix.version();
}
Docs: https://laravel.com/docs/5.8/mix#versioning-and-cache-busting

It seems there is a problem with mix.version(). After removing .version() from my webpack.mix.js file, everything appears to work.

Also maybe file is in different case, like 'element.vue' or 'Element.vue'

Make sure you include manifest.js in the page

Related

Node JS Randomly stops executing - Shows no errors

I am not sure where to start looking for the issue here.
I recently updated from angular 5 to angular 8. The application runs fine after the update. I don't know if this is related.
All of the sudden, my Node JS scripts stop seemingly at random. Sometimes they run, usually they don't. This is any script.
By "Stopping" I mean the console, mid execution, leaves the last line it wrote up, and on the next line, I am able to write more commands.
Example:
C:\location\> npm start
ng serve --aot
** Angular Live development server is listening on .....*
12 % building 22/23 modules 1 active ...somefile.ts
C:\location\>
There is no error, even when I run --verbose. Also, if I have multiple windows up or multiple servers running, they all stop at the same time. It is happening regardless of the application or package, including http-server, Angular, and installing dependencies.
I couldn't find anything related online. Has anyone ever seen this?
Update:
The issue is caused by my lack of CPU.
I thought I fixed it by updating, but that didn't work.
----------- (previous reply, not a solution)
It appears some of my installed dependency versions conflicted with package.json. Basically something did not fully update as expected.
I resolved the issue by running npm install.

Node serving an old version but still compiles updates

I'm creating a React application and am running into this issue. When I make changes to code, Node does recompile and even recognizes errors in the code, but no matter what, the localhost in the browser remains unchanged. Here's a list of things that I've tried:
Clearing the browser's cache and hard reloading the page
Switching browsers
Turning Node off and on again
Reinstalling Node
Creating a new directory, copying over the code, and then installing Node there
Turning the whole computer off and on again
I'm not sure what to try anymore. When installing Node, there are no errors, and no errors if I run npm start or npm build. As I said, I know Node is looking in the right directory since it recognizes when I make changes and shows errors when the code fails to compile. I also know I'm looking at the right localhost page since it isn't available when Node isn't running. However, the page remains perfectly usable and unchanged even if the code fails to compile, and actually is able to load before Node compiles all of the code.
I got the code itself from a zip file from GitHub and people who have their frontend set up have no issues with it. Node and all the other dependencies were downloaded by me, again, with no errors.
I'm using Node v10.16.0 and npm v6.9.0

Use nodemon or supervisor to reload only the files without restart all the server - WebStorm

I just took a look to this tutorial: How can I run nodemon from within WebStorm?
I'm wondering how reload only the files updated and don't restart the entire server instance.
I'm wondering also if it's possible to don't break a debug breakpoint, because for the moment the entire server is restarted and if I'm following instruction step by step using the debogguer, I lost the track.
By the way, there are my ways to use them with webstorm, it's particularly tricky with supervisor. Because it needs to get the app.js and everything as parameters.
Supervisor: https://docs.google.com/file/d/0ByzbHcAxmCyvTGdHOWJSTTYzNWs/edit
Nodemon: https://docs.google.com/file/d/0ByzbHcAxmCyvdVQ3azFhSlV0dEU/edit
You can use modules like hotswap to reload files when they change.
It can cause memory leaks and other stuff, but it's working fine for development.

Webstorm: debugging node.js sails app

I'm having a hard time finding the right combination of settings to allow me to debug my node.js sails application in webstorm.
These are the settings I've tried using, both configurations work (as in sails starts) but none is stopping at breakpoints.
If I go to the breakpoints menu and turn on 'Any exception enabled' - it does stop for exceptions, but never hits my breakpoints.
Any ideas? I'm on webstorm 7.0.1 and Node 0.10.18 / Sails 0.9.7
You don't need the --debug in node parameters. Here is my config and i am on 7.0.1 and node 0.10.4
Let me know if it helped. Also, you are hitting the bug to run debug right?
Also, can you please invalidate caches/ restart? That helps sometimes. Here is a snapshot in the file menu.
I had the same problem and simply installed sails local to the project and everything worked fine. Not sure why the configuration can't resolve the globally installed sails as that is the error I was getting, but the local install works fine. I should investigate further, but I'm lazy :)
When you open a new project on WebStorm, it detects the package.json file and it will ask you to install the dependencies locally. After that, by using the configuration mentioned before (not necessarily by using sails lift but using app.js directly instead), you can debug you application from WebStorm. Another way to do it, is by using this tool, that works like a charm: https://github.com/node-inspector/node-inspector :)

How to edit and deploy code without restarting server?

I have node server which i run using forever. But each time if I edit my code I'll have to restart the server. I came across the module called hotnode which can perform live edits but will it have the same performance as the forever module or can I run my code using both the modules. I am confused. Any help wil be much helpful
Have a look at nodemon.
nodemon will watch the files in the directory that nodemon was started, and if they change, it will automatically restart your node application.
As an alternative to nodemon you can use node-supervisor.
I used to use nodemon, but for some reason it didn't detect code changes on my linux box, which supervisor did flawlessly.
The downside is that it doesn't (or at least didn't) give the colorful output nodemon gives.

Resources