Main process code is bundled for browser environment
See original GitHub issueDescribe the bug
npm run watch
failed with window is undefined
after add @koa/router
, caused by any-promise
package.
Vite seems only designed to bundle code for browser, so it uses browser
field of package.json
, and i found no way to disable this behavior.
To Reproduce
Steps to reproduce the behavior:
npm install koa @koa/router @types/koa @types/koa__router
- use koa router
npm run watch
- See error
Expected behavior
any-promise register-shim.js
should not included in bundle because it has been marked for browser only.
Screenshots If applicable, add screenshots to help explain your problem.
PS D:\~\src\github.com\cawa-93\vite-electron-builder> npm run watch
> watch
> node scripts/watch.js
下午9:48:44 [main] App threw an error during load
下午9:48:44 [main] ReferenceError: window is not defined
at Object.<anonymous> (D:\~\src\github.com\cawa-93\vite-electron-builder\packages\main\dist\index.js:14474:27)
at Module._compile (internal/modules/cjs/loader.js:1078:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1108:10)
at Module.load (internal/modules/cjs/loader.js:935:32)
at Module._load (internal/modules/cjs/loader.js:776:14)
at Function.f._load (electron/js2c/asar_bundle.js:5:12684)
at Module.require (internal/modules/cjs/loader.js:959:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (D:\~\src\github.com\cawa-93\vite-electron-builder\packages\main\dist\index.cjs:2:1)
at Module._compile (internal/modules/cjs/loader.js:1078:30)
Additional context
I searched about bundle for node with vite/rollup, but not found anything useful, maybe we should use esbuild for main/preload code directly?
Issue Analytics
- State:
- Created 2 years ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
accessing process.env freshly in bundled code #6850 - GitHub
I've been wondering for quite a while, why webpack insists by design/default of compiling in the process.env variables at all. It seems rather ......
Read more >Demystifying Code Bundling with JavaScript Modules
The bundle is the main script file, which the browser loads through a <script> tag. (Or there can be multiple bundle files, but...
Read more >Bundle.js - Uncaught ReferenceError: process is not defined ...
env when running the Angular app on the browser (without Angular Universal ), e.g. by ng serve . Run npm i -S process...
Read more >Module Bundling with Webpack - LearnHowToProgram.com
The browser loads them individually, which takes time. But combining code from all dependencies into one file (known as a bundle) decreases this...
Read more >Building without bundling: How to do more with less
Unbundled roadblock #2: Most npm packages—even primarily web-focused packages—require a Node.js-like environment and will fail in the browser.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Perhaps you will be better to explore other templates or approaches, since the main idea of this template is using a single build tool for everything.
It works now, external dependency is handled by electron-builder, seems electron builder not handle transform result of
import *
That’s a strange workaround because
allowSyntheticDefaultImports
should be no-op here.Maybe later i will send a PR to use esbuild directly for main/preload code, because vite is not designed for that.
Thanks for the quick response anyway.