Strange lint error when using with Quasar framework

[sluedecke]

I am encountering strange lint errors when I try to use pouch-vue with the quasar framework. All works fine when I use the development mode of Quasar, even 'yarn lint' runs without error. But when I run quasar build errors as seen below happen.

This occurs after a clean setup of a fresh quasar project and simply adding pouch-vue and some dependencies. Maybe there is something wrong with my approach? Please check the sample repository https://github.com/sluedecke/sl-quasar-lint which exhibits the same error.

$ quasar build

 Build mode........ spa
 Pkg quasar........ v1.12.4
 Pkg @quasar/app... v1.9.6
 Debugging......... no
 Publishing........ no

 App · Reading quasar.conf.js
 App · Using MODERN build (ES6+)
 App · Extending SPA Webpack config
 App · Cleaned build artifact: "DEVFOLDER/sl-quasar-lint/dist/spa"
 App · Generating Webpack entry point
 App · Compiling with Webpack...
Starting type checking service...

 • Compiling:
 └── SPA ████████████████████ 100% done in 7687 ms


 App · ⚠️  12 errors encountered:

DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(2117,18):
TS2430: Interface 'QDate' incorrectly extends interface 'Vue'.
  Property 'options' is optional in type 'QDate' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(4315,18):
TS2430: Interface 'QOptionGroup' incorrectly extends interface 'Vue'.
  Property 'options' is optional in type 'QOptionGroup' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(5055,18):
TS2430: Interface 'QSelect' incorrectly extends interface 'Vue'.
  Property 'options' is optional in type 'QSelect' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(6804,18):
TS2430: Interface 'QTime' incorrectly extends interface 'Vue'.
  Property 'options' is optional in type 'QTime' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8083,32):
TS2344: Type 'QDate' does not satisfy the constraint 'Vue'.
  Property 'options' is optional in type 'QDate' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8111,39):
TS2344: Type 'QOptionGroup' does not satisfy the constraint 'Vue'.
  Property 'options' is optional in type 'QOptionGroup' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
xERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8128,34):
TS2344: Type 'QSelect' does not satisfy the constraint 'Vue'.
  Property 'options' is optional in type 'QSelect' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8168,32):
TS2344: Type 'QTime' does not satisfy the constraint 'Vue'.
  Property 'options' is optional in type 'QTime' but required in type 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8320,36):
TS2344: Type 'QDate' does not satisfy the constraint 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8348,43):
TS2344: Type 'QOptionGroup' does not satisfy the constraint 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8365,38):
TS2344: Type 'QSelect' does not satisfy the constraint 'Vue'.
DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts
ERROR in DEVFOLDER/sl-quasar-lint/node_modules/quasar/dist/types/index.d.ts(8405,36):
TS2344: Type 'QTime' does not satisfy the constraint 'Vue'.

[sluedecke]

The error is related to the src/boot/pouch-vue.ts. If I delete it, no error occurs.

[sluedecke]

Still no 'real' luck with latest @quasar/app and similar, but I have an usable workaround for the compilation error seen above and the other one not mentioned:

Errors about options being optional ( Property 'options' is optional in type 'QDate' but required in type 'Vue'.)

Make options optional to Vue again in node_modules/pouch-vue/types/index.d.ts

--- index.d.ts.orig	2020-07-02 23:49:09.884805133 +0200
+++ index.d.ts	2020-07-02 23:41:41.002743274 +0200
@@ -57,7 +57,7 @@
         $pouch: PouchAPI;
         $databases: PouchDatabases;
         _liveFeeds: Record<string, PouchDB.LiveFind.LiveFeed>;
-        options: any;
+        options?: any;
     }
 }
 declare module 'vue/types/options' {

Using to accesors defined in pouch by casting (this as any).pouchAccessor

e.g.

  ...
  pouch: {
    config() {
      return {
        database: 'todo',
        selector: { $collectionType: 'ConfigurationCollection' },
        first: true
      };
    },
  },
  ...
  methods: {
    someRoutine(): any {
      console.log('Configuration is', (this as any).config);
    }
  }
  ...

HTH