search

caoxiemeihao / nuxt-electron

Integrate Nuxt and Electron
MIT License
169 stars 18 forks source link

Can't add nuxt-electron to new 3.8.1 project #56

Closed MichaelJCole closed 7 months ago

MichaelJCole commented 7 months ago

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. (/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. (/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 commented 7 months ago

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

MichaelJCole commented 7 months ago

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.