error pouchdb on vite ReferenceError: global is not defined

Question

When I follow the instructions in the official pouchdb documentation and try to use pouchdb, it gives me an error saying:

ReferenceError: global is not defined

I am using Vite particularly in a Quasar Vue3 project

//package.json
"pouchdb": "^8.0.1",
"quasar": "^2.6.0",
"vue": "^3.0.0",
"vite": "^2.5.10",

code error import PouchDB from 'pouchdb'; const dbprueba = new PouchDB('kittens');

Apparently the error occurs because the "global" object is no longer exposed in Vite and pouchdb refers to that object.

Does anyone know what adjustments need to be made to the project to solve this problem?

Does anyone know what adjustments need to be made to the project to solve this problem?

Answer 1

Searching the internet there is very little documentation about the error, but I managed to find a solution to it, and it is quite simple.

Step 1: We have to install an additional package called events

npm install events

line of package.json

"events": "^3.3.0",

Step 2: Search for the .html file, it is usually index.html and place a line of script there, I recommend putting it inside the at the end, before closing the head, however it also works when putting it as the first line of the "body"

<script>window.global = window</script>

what this line does is declare the "global" variable so that pouchDB uses it, given the problem that Vite does not declare that variable.

Step 3: Now we can import and use pouchdb, the following example creates a collection and then prints its information to the console.

import PouchDB from 'pouchdb';
const dbprueba = new PouchDB('kittens');
dbprueba.info().then(function (info) {
      console.log(info);
});