page reloads on saving a file

how to stop a page from reloading when i save a vs code file
57 Replies
Jochem
Jochem3mo ago
there's a thousand ways that could be happening, you'll have to be more specific in what tooling you're using also, it's generally considered a feature, not a bug, so I'm not sure it would be possible to disable it
bfmv
bfmvOP3mo ago
put "liveServer.settings.ignoreFiles":["**"] in your settings.json file a person in stackoverflow suggested this, but idk if its safe im using vs code
Jochem
Jochem3mo ago
vs code on its own does not reload pages when you save a file are you using live server? Or vite? or some other tool?
bfmv
bfmvOP3mo ago
yes live server
Kevin Powell
Kevin Powell3mo ago
Like Jochem said, it's sort of one of the features... why do you want to disable it? You could just open the HTML file instead of using live server, and refresh as needed 🤷 - that's how we used to do it back in the day 😄
Jochem
Jochem3mo ago
in the bad old days 😄
bfmv
bfmvOP3mo ago
actually when im in page 2 and editting the code and click save in vs code, im sent back to the first page thats y
Kevin Powell
Kevin Powell3mo ago
that isn't normal. are you writing regular html/css/js, or are you making some sort of web app?
bfmv
bfmvOP3mo ago
yup regular html css js
Kevin Powell
Kevin Powell3mo ago
so, if you go to page two, it's like localhost:3000/page-two.html in the address bar, or whatever?
bfmv
bfmvOP3mo ago
actually its the same html page but i made it look like its multiple pages im making a multi page form
STEP 1
YOUR INFO

STEP 2
SELECT PLAN

STEP 3
ADD-ONS

STEP 4
SUMMARY
STEP 1
YOUR INFO

STEP 2
SELECT PLAN

STEP 3
ADD-ONS

STEP 4
SUMMARY
each step is like a page but its all in the same html file
Kevin Powell
Kevin Powell3mo ago
ah, yeah okay, that makes sense then. I'd just open the HTML file, instead of using live server. If you're using regular HTML/CSS/JS, the only benefit of using live server is to refresh on save.
13eck
13eck3mo ago
If you're using JS modules you need a server and can't just open a file JS modules require a secure context. IE they require HTTPS to use (or HTTP on local host)
bfmv
bfmvOP3mo ago
oh
13eck
13eck3mo ago
Besides, if steps 1, 2, and 3 all require input by the user, what's the point of changing the page and not reloading? You'll need to re-enter the info anyway
bfmv
bfmvOP3mo ago
only step 1 requires input, but i didnt understand why we will require to reload the page in case all 3 steps require input by the user
13eck
13eck3mo ago
When the page reloads any user input is gone. So you need to start over to get the input back
Jochem
Jochem3mo ago
it resets the state of your JS too, by necessity and any changes you made to the files on the server won't show up until the page reloads either
13eck
13eck3mo ago
Also, "Select Plan" and "Add-ons" sounds like it's getting some input from the user So, I guess my question is this: Why don't you want the page to reload? It's a handy feature that allows changes to be shown immediately. If you don't want the changes to take effect…don't save the file :p
bfmv
bfmvOP3mo ago
but my page is not reloading we just have to select options from the given choices in those 2 steps
13eck
13eck3mo ago
That's user input This…makes no sense. You said the page is reloading and you want it to not. I'm asking why you want that
bfmv
bfmvOP3mo ago
oh, it only reloads when i update the code through vs code and i dont want it to reload when i update the code
13eck
13eck3mo ago
Why don't you want the page to reload? It's a handy feature that allows changes to be shown immediately.
bfmv
bfmvOP3mo ago
but how do i know if the changes i made, happened accordingly as i wished or not
13eck
13eck3mo ago
You reload the page. If the changes worked as you wanted you'll see it
ἔρως
ἔρως3mo ago
if you have python, you cab start a simple http server can php works as well that should be enough to have a real server in case you need js modules
Jochem
Jochem3mo ago
You cannot have changes in HTML or JS without reloading the page in the browser
bfmv
bfmvOP3mo ago
and all the actions i performed on the page will be reset im using html css js
Jochem
Jochem3mo ago
yes, welcome to web development
bfmv
bfmvOP3mo ago
woahhhhhhhh
Jochem
Jochem3mo ago
Epic is just complicating the issue
ἔρως
ἔρως3mo ago
if you need to keep your changes, store them in localstorage
bfmv
bfmvOP3mo ago
so this is a world wide problem
ἔρως
ἔρως3mo ago
i was answering to the one about js modules
Jochem
Jochem3mo ago
"problem" isn't the right description. If you change JS code or HTML, your page needs to reload out of necessity. Running new code over the state of old code will cause weird issues, so the only way to be sure it'll work the way it's supposed to work is to clear the state and start over hot module reloading tries to combat some of that, but even then you'll lose local state quite often when you change code
bfmv
bfmvOP3mo ago
ohh so what do i do 😔
Jochem
Jochem3mo ago
try to limit the number of times you're editing code and retrying/reloading, minimize the amount of info you fill into the form, or even for development purposes set a value on the inputs if you really do have to fill out the form often I'm sure there's browser plugins that can autofill your form for you too
bfmv
bfmvOP3mo ago
btw do u also face problems becuz of this
Jochem
Jochem3mo ago
I wouldn't call it problems but yes, my page needs to reload too when I make changes, and yes, my state then also gets cleared
ἔρως
ἔρως3mo ago
save the changes in local storage and on load, reset everything
Jochem
Jochem3mo ago
that's not a reasonable thing to do if it's just for DX if that's a feature the end-user would benefit from, sure
bfmv
bfmvOP3mo ago
is it a backend thing (local storage?)
ἔρως
ἔρως3mo ago
true, but if it is a multi-step form, it is something you MUST consider no it's in js
Jochem
Jochem3mo ago
but if it's just annoying to fill out the form a couple dozen times during development, that's just asking to introduce more bugs and odd behavior
bfmv
bfmvOP3mo ago
u mean saving the values as js variables?
ἔρως
ἔρως3mo ago
no, in local storage
bfmv
bfmvOP3mo ago
do u find it annoying
Jochem
Jochem3mo ago
🤷
ἔρως
ἔρως3mo ago
that is true, but if it is something the end user will have to re-do might as well add this
Jochem
Jochem3mo ago
not everything in every hobby / job is enjoyable
bfmv
bfmvOP3mo ago
btw i could just display: none all the other steps (pages) when im not working on them big brain move?
Jochem
Jochem3mo ago
not sure what that would solve? oh, it would show you the next steps even without completing the first
bfmv
bfmvOP3mo ago
i wont be sent to the first page whenever im saving the vs file
Jochem
Jochem3mo ago
yeah, that works, if you're just working on the visuals
bfmv
bfmvOP3mo ago
yeah yes
ἔρως
ἔρως3mo ago
it's jank but should work
bfmv
bfmvOP3mo ago
okay

Did you find this page helpful?