Nuxt.js: Don't see the loading / progress bar at the top

Created on 21 Aug 2019  路  9Comments  路  Source: nuxt/nuxt.js

Version

v2.9.1

Reproduction link

http://www.nourl.com

Steps to reproduce

With an installation of nuxt / nuxt-edge, I don't see the loading / progress bar at the top.

According to this doc, the loading indicator should be enabled by default, but it isn't.
https://nuxtjs.org/api/configuration-loading#disable-the-progress-bar

I also tried this in nuxt.config.js:

  loading: { color: "#f00" },

What is expected ?

Loading / progress bar indicator should show up

What is actually happening?

It does not.

This bug report is available on Nuxt community (#c9665)
bug-report pending-repro stale

Most helpful comment

@andreynazarov3 if you want to attach another method to mounted without overwriting the original one, use an array:

// plugins/cookie.js
export default ({ app, store }) => {
  app.mounted = [app.mounted, function () {
    ... some code
  }];
};

All 9 comments

Maybe your page just loads very quickly, as in within the throttle time?

If not => reproduction

I see the loading bar (red) flash by quickly when an error page is seen...but not on other pages. I'd like the same to show up on the other pages, except in blue. Will try to reproduce this again.

same here, loading is not showing

i found what was reason in my case.
i had a plugin which replaced mounted() hook in App.js file, so

mounted() {
this.$loading = this.$refs.loading
}

was not triggering

@andreynazarov3 Thanks, interesting reason. How exactly did the plugin replaced the hook? Runtime or in the template? Was it a 3rd party plugin?

@pimlie it was my own plugin to work with cookies on app mount, I was thinking that somehow it will not replace basic mounted hook and just add this additional functionality...

// plugins/cookie.js
export default ({ app, store }) => {
  app.mounted = function() {
    .... some code
  };
};

@andreynazarov3 if you want to attach another method to mounted without overwriting the original one, use an array:

// plugins/cookie.js
export default ({ app, store }) => {
  app.mounted = [app.mounted, function () {
    ... some code
  }];
};

Thanks for your contribution to Nuxt.js!
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you would like this issue to remain open:

  1. Verify that you can still reproduce the issue in the latest version of nuxt-edge
  2. Comment the steps to reproduce it

Issues that are labeled as pending will not be automatically marked as stale.

Hello
I need help.

I need send data to the default layout from any child component.

please contact me.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mattdharmon picture mattdharmon  路  3Comments

maicong picture maicong  路  3Comments

danieloprado picture danieloprado  路  3Comments

lazycrazy picture lazycrazy  路  3Comments

mikekidder picture mikekidder  路  3Comments