question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

The type definition of `$loading` conflicts with Buefy's one

See original GitHub issue

Version

v2.4.0

Reproduction link

https://github.com/iwata/codesandbox-nuxt

Steps to reproduce

$ git clone git@github.com:iwata/codesandbox-nuxt.git
$ yarn install
$ yarn dev

What is expected ?

No type checking errors

What is actually happening?

It shows this error:

ERROR in /Users/iwata/.go/src/github.com/iwata/codesandbox-nuxt/node_modules/@nuxt/vue-app/types/index.d.ts(73,18):
TS2430: Interface 'NuxtApp' incorrectly extends interface 'Vue'.
  Types of property '$loading' are incompatible.
    Property 'open' is missing in type 'NuxtLoading' but required in type '{ open: (params: LoadingConfig) => { close: () => any; }; }'.

Additional comments?

If you import Buefy looks like plugins/buefy.ts, it declares $loading for Vue instance. https://github.com/buefy/buefy/blob/dev/types/index.d.ts#L10 So NuxtApp extends the Vue, therefore $loading conflicts. https://github.com/nuxt/nuxt.js/blob/v2.4.0/packages/vue-app/types/index.d.ts#L73-L74

<div align="right">This bug report is available on Nuxt community (#c8559)</div>

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:8
  • Comments:40 (5 by maintainers)

github_iconTop GitHub Comments

57reactions
P-de-Jongcommented, Mar 10, 2019

For now i added the following to my tsconfig.json:

"compilerOptions": {
    "skipLibCheck": true
}
22reactions
manniLcommented, Mar 25, 2019

We will change it to $nuxt.$loading this.$nuxt.$progress in Nuxt 3 ☺️

Read more comments on GitHub >

github_iconTop Results From Across the Web

Loading | Buefy
A simple loading overlay. The Loading will be closed after about 10 seconds, by pressing escape or by clicking outside. Use ...
Read more >
How to solve scss conflict between NuxtJS and Vuetify 2.0
I am trying to upgrade an existing NuxtJs project to use the new vuetify version 2.0. NuxtJS uses the 'node-sass' package for processing...
Read more >
Validation Observer - VeeValidate
The ValidationObserver is a convenient component that also uses the scoped slots feature to communicate the current state of your inputs as a...
Read more >
Bootstrap vs Buefy | What are the differences? - StackShare
I am planning to redesign my entire application, which is currently in Bootstrap. I heard about Tailwind CSS, and I think its really...
Read more >
How to Prototype a Web App with Django and Vue.js - SitePoint
One more time, don't mind about program versions and file sizes as these will vary. ... Here we'll define the back-end database with...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Hashnode Post

No results found