search

antfu-collective / vitesse

🏕 Opinionated Vite + Vue Starter Template
https://vitesse.netlify.app/
MIT License
8.93k stars 937 forks source link

"ReferenceError: window is not defined" with ApexCharts on vitesse #474

Closed HelloWorldPage closed 1 year ago

HelloWorldPage commented 1 year ago

Describe the bug

Hi, after days of testing and a dolphin therapy i need help. I just grab the Vitesse-repo an installed Apexchart as recommended (https://www.npmjs.com/package/vue3-apexcharts) everything works fine - in DEV but i want to build the PROD i have some errors(see below). What did i do (of course i could write this in setup, but that was the original example)?--> I just put a new Page "apex.vue" in the pages folder: `

` [vite-ssg] Critical CSS generation enabled via `critters` [Vue Router warn]: uncaught error during route navigation: ReferenceError: window is not defined at Object. (/Users/.../charttest/node_modules/.pnpm/apexcharts@3.37.0/node_modules/apexcharts/dist/apexcharts.common.js:6:371062) at Module._compile (node:internal/modules/cjs/loader:1218:14) at Module._extensions..js (node:internal/modules/cjs/loader:1272:10) at Module.load (node:internal/modules/cjs/loader:1081:32) at Module._load (node:internal/modules/cjs/loader:922:12) at Module.require (node:internal/modules/cjs/loader:1105:19) at require (node:internal/modules/cjs/helpers:103:18) at 95e6 (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:185:18) at __webpack_require__ (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:21:30) at Module.fb15 (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:224:74) at __webpack_require__ (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:21:30) at /Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:85:18 at Object. (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:88:10) at Module._compile (node:internal/modules/cjs/loader:1218:14) at Module._extensions..js (node:internal/modules/cjs/loader:1272:10) at Module.load (node:internal/modules/cjs/loader:1081:32) at Module._load (node:internal/modules/cjs/loader:922:12) at ModuleWrap. (node:internal/modules/esm/translators:169:29) at ModuleJob.run (node:internal/modules/esm/module_job:194:25) node:internal/process/promises:288 triggerUncaughtException(err, true /* fromPromise */); ^ ReferenceError: window is not defined at Object. (/Users/.../charttest/node_modules/.pnpm/apexcharts@3.37.0/node_modules/apexcharts/dist/apexcharts.common.js:6:371062) at Module._compile (node:internal/modules/cjs/loader:1218:14) at Module._extensions..js (node:internal/modules/cjs/loader:1272:10) at Module.load (node:internal/modules/cjs/loader:1081:32) at Module._load (node:internal/modules/cjs/loader:922:12) at Module.require (node:internal/modules/cjs/loader:1105:19) at require (node:internal/modules/cjs/helpers:103:18) at 95e6 (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:185:18) at __webpack_require__ (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:21:30) at Module.fb15 (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:224:74) at __webpack_require__ (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:21:30) at /Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:85:18 at Object. (/Users/.../charttest/node_modules/.pnpm/vue3-apexcharts@1.4.1_ykaca5m3n6rsst35dvppqgdbhu/node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:88:10) at Module._compile (node:internal/modules/cjs/loader:1218:14) at Module._extensions..js (node:internal/modules/cjs/loader:1272:10) at Module.load (node:internal/modules/cjs/loader:1081:32) at Module._load (node:internal/modules/cjs/loader:922:12) at ModuleWrap. (node:internal/modules/esm/translators:169:29) at ModuleJob.run (node:internal/modules/esm/module_job:194:25) Node.js v18.13.0  ELIFECYCLE  Command failed with exit code 1.    This error occurs also with Chartjs (only if i use the zoomPlugin - without plugin it is working)  Thanks in advance ### Reproduction https://github.com/alesiano/apexcharts ### System Info ```Shell System: OS: macOS 11.7.3 CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz Memory: 80.75 MB / 32.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 18.13.0 - ~/.nvm/versions/node/v18.13.0/bin/node npm: 9.4.1 - ~/.nvm/versions/node/v18.13.0/bin/npm Browsers: Chrome: 109.0.5414.119 Safari: 16.3 ``` ### Used Package Manager pnpm ### Validations - [X] Follow our [Code of Conduct](https://github.com/antfu/.github/blob/main/CODE_OF_CONDUCT.md) - [X] Read the [Contributing Guide](https://github.com/antfu/contribute). - [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate. - [X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead. - [X] The provided reproduction is a [minimal reproducible](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.
HelloWorldPage commented 1 year ago

FYI: that this is a "pnpm build" thing (what is "vite-ssg build"). "pnpm vite build" works.

antfu commented 1 year ago

It's because the package you used is not compactible with SSR. It's not related to Vitesse.