I have the latest nodejs server installed with the yalr module on the backend.
On the frontend I use the WebStorm IDE which auto-saves changes. This forces a refresh in my browser. After the refresh the changes are not shown! I still see the old version!
How could I configure yalr to refresh with the newly changed source files?
I've tried setting the debounce parameter, however it seem to do nothing no matter what I set it. The sleepAfter parameter didn't help either.
I should note that sometimes the page refreshes twice which, while annoying, DOES actually load the changes. But I can't depend on that.
How did you set up live-reload for the frontend?
Related
I added angular universal to my project and upon saving, it compiles successfully though in the network tab I can see the request for whatever route im on gets hung on pending and the website stays loading forever in the browser. This issue is not present during CRS. Things I have tried that did not work:
I have cloned the same project elsewhere to see if it was some fat finger accident
I have not only add logic to stop DOM methods from being used, I have outright removed the use of them everywhere in the app
I added 3rd party libraries like Domino js to mock methods on Node
I started a completely blank angular project, added nothing to it other than angular universal and I get the same issue!
I will try it on another computer soon to see if it is just an issue on this machine.
What could the issue be? I don't get any errors and refreshing the page it works.
Is hot reload broken for me? missing anything?
EDIT: I have now tried it on a 2 other Windows machines and the result is the same. Perhaps this is a bug. Essentially makes Angular useless to me.
Angular Version 12.1
I was able to get it to work by upgrading my Angular to version 14, and starting a fresh project with SSR added. Frustratingly to say the least but I can finish my project and I copied back in most of my code from the project I was working on.
For what ever reason Angular 11 and 12 were giving me this issue on multiple machines on fresh angular projects. It never gave me any errors to show. I will report back if any time during the rest of the porting of code if the issue persists.
I had the same hassle when initially integrated the Angular Universal to my project.
After a period of time I consider the according workaround:
SSR for the single page applications is useful in production for SEO, Open Graph, etc.
Angular Universal adds additional files:
main.server.ts
app.server.module.ts
Then the classic angular approaches are still possible to be used (the old app.module.ts).
Now for the local development environment I'm continue using the classic "ng serve" command and the Angular continue reloads normally on each file change.
And the SSR is compileing only for the production build.
Then if I want to debug something related to the SSR I'm deploying the production build to the test environment and calling the test urls to see the results.
I am new to Node and working on an application using NodeJS, Express, MySql and Sequelize. Its an application that performs CRUD operations.
For learning Purpose, I am working in a github project.
I came across .hbs file in Views folder.
I tried to edit the Heading name in this file, but still my changes are not reflecting in Browser View.
Is there anything I am missing? Even after restarting server, my changes are not visible.
Reason :
Handlebars (hbs) is a server side view template. It needs to be compiled on the server when any changes are made to it. It is not a .html for which you don't need to restart the node server to see the changes.
Solution :
Restart the node app to reflect any changes or better use nodemon.
Cheers.
P.S : Mark the answer as accepted if it solves your problem.
newbie here. Initially I had trouble installing live server as seen in https://www.youtube.com/watch?v=q78u9lBXvj0. Took me a while to search and figure out the problem.
I had to install node.js, followed by using:
export PATH=$PATH:/usr/local/git/bin:/usr/local/bin
Then I had trouble with the npm install -g, kept getting these errors. Turns out I had to use 'sudo' in front. So that worked and it installed.
Now, whenever I get into the terminal, get into my folder and type live-server, a new http:// 127.0.0.1:8080/ page will appear. I seem to be able to see what is the current progress, but it won't auto refresh whenever I make any changes. I'm not sure if it's because I've installed it incorrectly or if it's because of a setting.
One thing I noticed is that in the video, whenever he types live-server he also gets the two lines below of 'send deprecated send.root...' which I don't get.
I simply get the first line of 'serving...' followed by path directory and then 'at http:// 127.0.0.1:8080' whereas his is 'at http: //localhost:8080'
I'm assuming it might be a setting issue, but I can't figure out what the problem is. So how do I get github's live-server to reload my pages automatically?
Most probably you use a browser which doesn't support WebSockets. As the documentation states:
If there are errors, deal with them. You will need a browser that supports WebSockets.
After reading the Meteor official documentation regarding this subjet, I would like to know if it's possible to change my code, deploy the new version, but without restarting the node js server? My idea is to have a development server, where I make my updates, and then after testing commit the changes to the real production server, so that I don't break anything.
If this doen't make any sense, what is the current best approach to accomplish the same results?
Thanks a lot for the help.
You should not need to reset the node js server. Any changes to the code will be injected into the client's browser.
From Meteor main page:
Hot Code Pushes.
Update your app while users are connected without disturbing them. When you push a new version, the new code is seamlessly injected into each browser frame in which the app is open.
Seeing how node.js is ultimately javascript, shouldn't changes to any files be seen when trying to run the app command? I've forked the yuidocjs repo on github and am trying to work my way through my local build, but for some reason my minor changes do not get picked up. I'm new to node.js so I'm not really sure what the exact conventions are.
In node.js when you require a file the source code gets interpreted. It's considered good practice to require all code when you start the server so all the code gets interpreted once.
The code does not get re-interpreted whenever you run it though.
So changes are not instantaneous.
To help you out, try supervisor which does hot reloading of the server on code changes.
It is possible to make instant changes happen by re-interpreting source code but that is not the default action. Generally you should just re-start the server.
Also see nodemon which will automagically reload changed files under it's authority.
EDIT
Rereading your question, it appears you are asking about the following scenario:
Run app to test
Quit app to refactor js code
Restart app
And you're asking why your changes do not appear at step 3?
If this is the case, you are seeing something very strange which might be related to how and from where files are being required.
In node, run:
console.dir(require.paths);
To see where node is looking for any resources you are requiring. If there is a copy of the file you're changing in any of the paths listed which is not the file you're editing, this would explain your problem.