Can't add nuxt-electron to new 3.8.1 project

[MichaelJCole]

Hi, I'm attempting to add nuxt-electron to a new nuxt project and getting errors.

Trying to install from README

> $ nuxi init
✔ Which package manager would you like to use?

npm

◐ Installing dependencies...                                                                                                                                     7:36:56 PM

postinstall

nuxt prepare

ℹ Nuxt collects completely anonymous data about usage.                                                                                                          7:37:16 PM

This will help us improve Nuxt developer experience over time.

Read more on https://github.com/nuxt/telemetry
✔ Are you interested in participating?

Yes
✔ Types generated in .nuxt                                                                                                                                      7:37:21 PM
added 730 packages, and audited 732 packages in 24s
118 packages are looking for funding

run npm fund for details
found 0 vulnerabilities

✔ Installation completed.                                                                                                                                       7:37:21 PM
✔ Initialize git repository?

No

7:37:24 PM

✨ Nuxt project has been created with the v3 template. Next steps:

› cd nuxt-app                                                                                                                                                   7:37:24 PM

› Start development server with npm run dev                                                                                                                     7:37:24 PM

$ cd nuxt-app

$ npm run dev


dev

nuxt dev

Nuxt 3.8.1 with Nitro 2.7.2                                                                                                                                      7:37:30 PM

7:37:30 PM

➜ Local:    http://localhost:3000/

➜ Network:  use --host to expose
➜ DevTools: press Shift + Alt + D in the browser (v1.0.2)                                                                                                      7:37:31 PM
ℹ Vite server warmed up in 563ms                                                                                                                                7:37:32 PM

ℹ Vite client warmed up in 721ms                                                                                                                                7:37:32 PM

✔ Nitro built in 250 ms                                                                                                                                   nitro 7:37:32 PM

$ npm install --save-dev nuxt-electron vite-plugin-electron vite-plugin-electron-renderer electron electron-builder

added 173 packages, and audited 905 packages in 11s
145 packages are looking for funding

run npm fund for details
found 0 vulnerabilities

$ npm run dev


dev

nuxt dev

Nuxt 3.8.1 with Nitro 2.7.2                                                                                                                                      7:40:25 PM

7:40:25 PM

➜ Local:    http://localhost:3000/

➜ Network:  use --host to expose
➜ DevTools: press Shift + Alt + D in the browser (v1.0.2)                                                                                                      7:40:26 PM
vite v4.5.0 building for development...                                                                                                                          7:40:26 PM

7:40:26 PM

watching for file changes...

7:40:26 PM

build started...

✓ 1 modules transformed.                                                                                                                                         7:40:26 PM

dist-electron/main.js  0.14 kB │ gzip: 0.14 kB                                                                                                                   7:40:26 PM

built in 238ms.                                                                                                                                                  7:40:26 PM

App threw an error during load

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/michael/nuxt-app/dist-electron/main.js from /home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js not supported.

/home/michael/nuxt-app/dist-electron/main.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.

Instead rename /home/michael/nuxt-app/dist-electron/main.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /home/michael/nuxt-app/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
at Function._load (node:electron/js2c/asar_bundle:2:13327)
at loadApplicationPackage (/home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js:121:16)
at Object.<anonymous> (/home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js:233:9)
at Function._load (node:electron/js2c/asar_bundle:2:13327)
at node:electron/js2c/browser_init:2:121783
at node:electron/js2c/browser_init:2:121986
at node:electron/js2c/browser_init:2:121990
at Function._load (node:electron/js2c/asar_bundle:2:13327)

A JavaScript error occurred in the main process

Uncaught Exception:

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/michael/nuxt-app/dist-electron/main.js from /home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js not supported.

/home/michael/nuxt-app/dist-electron/main.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.

Instead rename /home/michael/nuxt-app/dist-electron/main.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /home/michael/nuxt-app/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
at Function._load (node:electron/js2c/asar_bundle:2:13327)
at loadApplicationPackage (/home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js:121:16)
at Object.<anonymous> (/home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js:233:9)
at Function._load (node:electron/js2c/asar_bundle:2:13327)
at node:electron/js2c/browser_init:2:121783
at node:electron/js2c/browser_init:2:121986
at node:electron/js2c/browser_init:2:121990
at Function._load (node:electron/js2c/asar_bundle:2:13327)

ℹ Vite client warmed up in 548ms                                                                                                                                7:40:27 PM

libva error: vaGetDriverNameByIndex() failed with unknown libva error, driver_name = (null)

✔ Nitro built in 243 ms                                                                                                                                   nitro 7:40:27 PM

The error is this:

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/michael/nuxt-app/dist-electron/main.js from /home/michael/nuxt-app/node_modules/electron/dist/resources/default_app.asar/main.js not supported.
/home/michael/nuxt-app/dist-electron/main.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename /home/michael/nuxt-app/dist-electron/main.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /home/michael/nuxt-app/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).

How can I fix this error? Thank you

[nirgn975]

Remove the "type": "module" in package.json, this worked for me, on v3.8.2

[MichaelJCole]

There were some this-and-that's around my problem with type: module, but I started using the new Electron 28 beta which supports modules and was able to get it to work.