Fixing "Global is not Definied" in Vite and Vue 3

While starting my first full project with Vite + Vue 3 after trying to start using Pinia, I as getting an error:

ReferenceError: global is not defined
    at node_modules/immediate/lib/mutation.js (mutation.js:6:16)
    at __require (chunk-DFKQJ226.js?v=321f6407:8:50)
    at node_modules/immediate/lib/index.js (index.js:5:3)
    at __require (chunk-DFKQJ226.js?v=321f6407:8:50)

After commenting lines in and out, I was able to trace down that the root of the issue was coming from my PouchDB import line, which led me to this Github Issue solution.

In my case it seems like the only change that was necessary is to add this to the top of main.js:

import process from "process/browser"
window.process = process = window
// Rest of your file goes here ๐Ÿ‘‡๐Ÿป

Hope this helps you not struggle for an hour ๐Ÿ’•

๐Ÿงช Experiment ๐Ÿงช | ๐Ÿ’ฅ Fail ๐Ÿ’ฅ | ๐Ÿง  Learn ๐Ÿง 
ยฉ 2024, Built with Nuxt