apal21 / nextjs-progressbar

A simple Next.js progressbar component using NProgress.

Home Page:https://www.npmjs.com/package/nextjs-progressbar

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Progress bar doesnt appear when you refresh the browser.

codepurse opened this issue · comments

commented

Hi! love your progress bar easy to follow, but how can i make it appear when i refresh the page. It appears only when you go to one page to another.

Hey @codepurse,

I'm glad you liked the progress bar.

Any package that you include in your project's package.json file executes only when the first javascript file/bundle is being downloaded to your machine. So on refresh, it tries to fetch the new content and it cannot render this progress bar until the basic required js is there on your machine.

However, in general, any react.js or next.js app first fetches an HTML file and then loads the javascript files accordingly. So here you can modify this HTML file to render the loader for the first time. You can also refer this: https://nextjs.org/docs/advanced-features/static-html-export