Error: Cannot find module './index.c0ba7d56.js'

[mtdvlpr]

Hi (again),

After solving #14, I'm faced with an even weird error. None of the nuxt generated scripts can be found when running a production build. Only entry.js.

When I extract the files from the .asar file I can see that the scripts are there and the names are correct, but somehow they aren't found.

Minimal reproduction repo: https://github.com/mtdvlpr/minimal-reproduction

Sorry to bother you again, but if you (or someone else) could figure this out, that'd be great!

[caoxiemeihao]

At present, you can add following options into you App. It's will be integrate the next version.

{
+ app: {
+   buildAssetsDir: '/',
+ },
}

[mtdvlpr]

@caoxiemeihao, implementing this shows a bunch of other errors (see reproduction repo).

[mtdvlpr]

@caoxiemeihao any idea what's happening here?

[caoxiemeihao]

I guess that BUG caused by import() encapsulation in Nuxt, I need some free time for resolve it. In the weekend I will try to do.

[mtdvlpr]

Alright, thanks for the hard work!

[caoxiemeihao]

vue-router uses dynamic import, which is the cause of the BUG, and I'm still looking for a way to disable it.

https://github.com/electron-vite/electron-vite-vue/issues?q=is%3Aissue+router#issuecomment-1375175289

[mtdvlpr]

Is there any workaround for this? I need to be able to build my app for production...

[caoxiemeihao]

Upgrade vite-plugin-electron-renderer to v0.13.7 😅 https://github.com/electron-vite/vite-plugin-electron-renderer/pull/45

[mtdvlpr]

The minimal reproduction works! On my real project I'm getting a memory leak when building:

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

I'm using Node.js v18.15

[caoxiemeihao]

How I reproduce it?

[mtdvlpr]

I fixed it using cross-env NODE_OPTIONS=--max-old-space-size=4096

[mtdvlpr]

Now I've run into the next issue on production build: the styles aren't being imported in production (see https://github.com/mtdvlpr/minimal-reproduction).

I'm using Vuetify and the styles.css is generated, but it's not being referenced in the generated html files for some reason...

[mtdvlpr]

And in development mode (yarn run dev) I get the following error (see https://github.com/mtdvlpr/minimal-reproduction):

Uncaught TypeError: Cannot set property close of #<Object> which has only a getter
    at node_modules/graceful-fs/graceful-fs.js (graceful-fs.js:52:6)
    at __require2 (chunk-OROXOI2D.js?v=7dae7f69:16:50)
    at node_modules/fs-extra/lib/fs/index.js (index.js:5:12)
    at __require2 (chunk-OROXOI2D.js?v=7dae7f69:16:50)
    at node_modules/fs-extra/lib/index.js (index.js:5:6)
    at __require2 (chunk-OROXOI2D.js?v=7dae7f69:16:50)
    at index.js:16:1

[mtdvlpr]

Now I've run into the next issue on production build: the styles aren't being imported in production (see https://github.com/mtdvlpr/minimal-reproduction).

I'm using Vuetify and the styles.css is generated, but it's not being referenced in the generated html files for some reason...

@caoxiemeihao should I move this issue to vite-plugin-electron-renderer?

[caoxiemeihao]

I saw this BUG, it comes esbuild pre-bundle and I'm trying to resolve it now 👀

Uncaught TypeError: Cannot set property close of #

[caoxiemeihao]

The code generated by esbuild will be wrapped Object.defineProperty and just provide get property, it can cnuse the BUG. MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Getter_only#examples esbuild - https://github.com/evanw/esbuild/issues/587

But, we can avoid the Vite's pre-bundle default behavior to resolve it.

export default defineNuxtConfig({
  electron: {
    renderer: {
      resolve: process.env.NODE_ENV === 'development'
        ? {
          'fs-extra': () => ({ platform: 'node' }), // here
        }
        : undefined,
    },
  },
});

Otherwise, upgrade vite-plugin-electron-renderer to 0.13.13

---

Maybe a better solution is coming soon :)

[mtdvlpr]

In dev mode (see https://github.com/mtdvlpr/minimal-reproduction):

[Vue warn]: Failed to resolve component: v-btn
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/" routeProps= {Component: {…}, route: {…}} pageKey="/"  ... > 
  at <FragmentWrapper > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=2 > 
  at <NuxtRoot>

[mtdvlpr]

Sorry for all the bug reports 😅

[caoxiemeihao]

A new to Nuxt? I'm a new to Nuxt and just read the vuetify docs, found it :)

https://vuetifyjs.com/en/getting-started/installation/#manual-steps

[mtdvlpr]

Sorry about that. Forgot the vite vuetify plugin. In production the styling is still gone...the .css file is there, but it's not referenced in the html file for some reason... (see https://github.com/mtdvlpr/minimal-reproduction)

[mtdvlpr]

@caoxiemeihao cssCodeSplit: true did the trick! I can finally build my application for production 🎉

Thanks so much for all the hard work and effort!