Electron import module error (after update from 3.11.1 tot 3.11.2 @quasar/app-webpack)

[J76F]

What happened?

After updating version 3.11.1 to 3.11.2 from @quasar/app-webpack, the Electron app no longer wants to build quasar dev -m electron. A referenceError is given.

It seems to have to do with update b4ce740 when I undo it it does work fine again.

If you compare the compiled files electron-main.js I notice that the modules with a "-" in a the name are not compiled correctly.
In version 3.11.1, this gives:

/***/ "electron-store":
/*!*********************************!*\
  !*** external "electron-store" ***!
  \*********************************/
/***/ ((module) => {

module.exports = require("electron-store");

/***/ }),

In version 3.11.2, this gives:

/***/ "electron-store":
/*!*********************************!*\
  !*** external "electron-store" ***!
  \*********************************/
/***/ ((module) => {

module.exports = electron-store;

/***/ }),

which are two unknown variables subtracted from each other instead of loading a module.

The problem only plays in the electron app quasar dev -m electron , the web app quasar dev goes fine.

What did you expect to happen?

That all modules load properly again as in previous version and the electron app is buildable.

Reproduction URL

https://github.com/J76F/quasar-webpack-electron-test

How to reproduce?

with version 3.11.2 of @quasar/app-webpack (build error):

1. use the github link (StackBlitz is no option because of only in electron build)
2. run

npm install
quasar dev -m electron

3. the error comes up

perform with previous version (3.11.1):
11. change version in package.json --> "@quasar/app-webpack": "3.11.1"
12. run

npm install
quasar dev -m electron

13. the build works fine.

Flavour

Quasar CLI with Webpack (@quasar/cli | @quasar/app-webpack)

Areas

Electron Mode

Platforms/Browsers

Electron

Quasar info output

Operating System - Windows_NT(10.0.19045) - win32/x64
NodeJs - 18.16.1

Global packages
  NPM - 9.5.1
  yarn - Not installed
  @quasar/cli - 2.3.0
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.12.7 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-webpack - 3.11.2 -- Quasar Framework App CLI with Webpack
  @quasar/extras - 1.16.7 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.3.4 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.2.5
  pinia - Not installed
  vuex - Not installed
  electron - 26.2.4 -- Build cross platform desktop apps with JavaScript, HTML, and CSS
  electron-packager - Not installed
  electron-builder - 24.6.4 -- A complete solution to package and build a ready for distribution Electron app for MacOS, Windows and Linux with “auto update” support out of the box
  @babel/core - 7.23.0 -- Babel compiler core.
  webpack - 5.88.2 -- Packs ECMAScript/CommonJs/AMD modules for the browser. Allows you to split your codebase into multiple bundles, which can be loaded on demand. Supports loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.
  webpack-dev-server - 4.11.1 -- Serves a webpack app. Updates the browser on changes.
  workbox-webpack-plugin - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  typescript - 4.9.4 -- TypeScript is a language for application scale JavaScript development
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Networking
  Host - 
  Wi-Fi -

Relevant log output

> quasar dev -m electron


 .d88888b.
d88P" "Y88b
888     888
888     888 888  888  8888b.  .d8888b   8888b.  888d888
888     888 888  888     "88b 88K          "88b 888P"
888 Y8b 888 888  888 .d888888 "Y8888b. .d888888 888
Y88b.Y8b88P Y88b 888 888  888      X88 888  888 888
 "Y888888"   "Y88888 "Y888888  88888P' "Y888888 888
       Y8b


 Dev mode.................. electron
 Pkg quasar................ v2.12.7
 Pkg @quasar/app-webpack... v3.11.2
 Pkg webpack............... v5
 Debugging................. enabled

 Configured browser support (>= 86.09% of global marketshare):
 · Chrome for Android >= 117
 · Firefox for Android >= 117
 · Android >= 117
 · Chrome >= 108
 · Edge >= 114
 · Firefox >= 108
 · iOS >= 15.5
 · Opera >= 98
 · Safari >= 16.1

 App • Chaining "Renderer" Webpack config
 App • Chaining "Preload" Webpack config
 App • Chaining "Main" Webpack config
 App •  WAIT  • Compiling of "Renderer" in progress...
 App •  DONE  • "Renderer" compiled with success • 14285ms



 App •  READY  • Compiled: "Renderer", "Main", "Preload"

 App • Running "C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\node_modules\electron\dist\electron.exe --inspect=5858 C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js" in C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test


Debugger listening on ws://127.0.0.1:5858/5466fab2-c014-4aac-8eb4-0d8cc1762e77
For help, see: https://nodejs.org/en/docs/inspector
App threw an error during load
ReferenceError: electron is not defined
    at electron-store (C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:59:18)
    at __webpack_require__ (C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:93:41)
    at eval (webpack://quasar-webpack-electron-test/./src-electron/electron-main.js?:5:72)
    at ./src-electron/electron-main.js (C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:19:1)
    at __webpack_require__ (C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:93:41)
    at C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:145:37
    at Object.<anonymous> (C:\Users\Jeroen Faber\Documents\VS-Code\quasar-webpack-electron-test\.quasar\electron\electron-main.js:147:12)
    at Module._compile (node:internal/modules/cjs/loader:1271:14)
    at Object..js (node:internal/modules/cjs/loader:1326:10)
    at Module.load (node:internal/modules/cjs/loader:1126:32)

Additional context

No response

[JayFett]

I have exactly the same problem after adding the "puppeteer-core" package. The issue is not difficult to reproduce.

[rstoenescu]

Thanks for this ticket and for the reproduction repo!
Fix is available in quasar/app-webpack 3.11.3