Cannot bundle Node.js built-in "fs" imported from ... Consider disabling ssr.noExternal or remove the built-in dependency

[irg1008]

Hi I am not able to build my astro app anymore. I disable ssr.NoExternal to no avail, still does not work.

This is my astro.config:

import cloudflare from '@astrojs/cloudflare'
import react from '@astrojs/react'
import sitemap from '@astrojs/sitemap'
import tailwind from '@astrojs/tailwind'
import { defineConfig } from 'astro/config'
import { VitePWA } from 'vite-plugin-pwa'

// https://astro.build/config
export default defineConfig({
  prefetch: true,
  devToolbar: {
    enabled: false,
  },
  integrations: [
    tailwind({
      nesting: true,
      applyBaseStyles: true,
    }),
    react(),
    sitemap(),
  ],
  output: 'server',
  adapter: cloudflare({
    platformProxy: {
      enabled: true,
    },
  }),
  build: {
    inlineStylesheets: 'always',
  },
  vite: {
    build: {
      cssMinify: 'lightningcss',
    },
    ssr: {
      external: ['node:buffer', 'node:crypto', 'node:fs'],
      noExternal: true,
    },
    plugins: [
      VitePWA({
        registerType: 'autoUpdate',
        includeAssets: ['**/*'],
        injectRegister: 'auto',
        workbox: {
          globDirectory: 'dist',
          globPatterns: ['**/*.{js,css,svg,png,jpg,jpeg,gif,webp,woff,woff2,ttf,eot,ico}'],
          navigateFallback: null,
        },
      }),
    ],
  },
})

Any idea on why this is happening?

[userquin]

Why are you using vite pwa plugin? You must use @vite-pwa/astro integration: add the integration as dev dependency, move vite pwa options to the integration and remove the pwa plugin.

Documentation can be found here: https://vite-pwa-org.netlify.app/frameworks/astro.html

And the repo here with some examples here: https://github.com/vite-pwa/astro

[irg1008]

Shit, took the code from a boilerplate repo. I didn't even know there was a PWA astro integration. For that I am really sorry

[irg1008]

Okay I am using the adapter now, I get the same errors from vite pwa

[userquin]

what errors? can you provide the link to the repo (if public)?

[irg1008]

Sorry, this issue is a mess from the beginning.

This is the public repo: https://github.com/irg1008/ivanruiz It is quite "huge" to narrow the problem down, so I will make a new one if necessary

The exact error I am receiving on running command astro check & astro build:

vite-plugin-pwa:build] [plugin vite:resolve] Cannot bundle Node.js built-in "fs" imported from "node_modules\.pnpm\esbuild@0.20.2\node_modules\esbuild\lib\main.js". Consider disabling ssr.noExternal or remove the built-in dependency.
file: C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/esbuild@0.20.2/node_modules/esbuild/lib/main.js
  Stack trace:
    at getRollupError (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/parseAst.js:376:41)
    at Object.error (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/node-entry.js:19378:20)
    at Object.handler (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/vite@5.2.2_@types+node@20.11.30_lightningcss@1.24.1/node_modules/vite/dist/node/chunks/dep-B-u6xNiR.js:67458:19)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async resolveId (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/node-entry.js:18144:26)
 ELIFECYCLE  Command failed with exit code 1.

The next step I took to solve is to add the failing dependencies to the astro.config.js file like this:

...
  build: {
    inlineStylesheets: 'always',
  },
  vite: {
    build: {
      cssMinify: 'lightningcss',
    },
    ssr: {
      external: ['node:buffer', 'node:crypto', 'every lib that keeps failing'],
    },
  },

This keeps failing and failing and I end up with 8 or 9 node libs included on external array. I also tried to disable noExternal to no avail.

The problem is cloudflare only supports node APIs when imported like "node:*", so adding those libraries and allows externals won't work for cloudflare deploy

This exact configuration (with no-adapter vite plugin) worked before

Again the problem is I don't really know where to look know, if not maybe keep reverting changes to see what caused this issue, so any help it is appreciated

Thank you

[userquin]

why you dont have the pnpm lock file?

[irg1008]

Inside the repo? https://github.com/irg1008/ivanruiz/blob/main/pnpm-lock.yaml

This one?

[irg1008]

To add information, I just disabled vitePWA entirely and it still fails with the next error:

[commonjs--resolver] [plugin vite:resolve] Cannot bundle Node.js built-in "fs" imported from "node_modules\.pnpm\esbuild@0.20.2\node_modules\esbuild\lib\main.js". Consider disabling ssr.noExternal or remove the built-in dependency.
file: C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/esbuild@0.20.2/node_modules/esbuild/lib/main.js
  Stack trace:
    at getRollupError (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/parseAst.js:376:41)
    at Object.error (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/node-entry.js:19378:20)
    at Object.handler (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/vite@5.2.2_@types+node@20.11.30_lightningcss@1.24.1/node_modules/vite/dist/node/chunks/dep-B-u6xNiR.js:67458:19)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async resolveId (file:///C:/Users/Ivan/Documents/Projects/Web/ivanruiz/node_modules/.pnpm/rollup@4.13.0/node_modules/rollup/dist/es/shared/node-entry.js:18144:26)

Same exact repo, same files, disabling VitePWA integration

[userquin]

This is a problem with Astro (I cannot build your repo with or without the PWA plugin or Astro PWA integration), I can remove the error replacing node:crypto in the endpoint just using global.crypto.randomUUID() (not async). Maybe you can ask in Astro discord server: https://discord.gg/astrodotbuild

But then we get another error in @astrojs/cloudflare/dist/entrypoints/server.advanced.js (in commonjs-resolver plugin) about process:

Tried also adding some polyfills, check https://github.com/Giszmo/nostroid/blob/master/vite.config.ts (we needed some polyfills in the SvelteKit repo, maybe you can play with them)

[irg1008]

Okay I found the source of the problem, the i18n library I am using i'ts importing "node:fs", "node:os" and some others node apis not compatible with the chosen adapter (cloudflare, see https://developers.cloudflare.com/workers/runtime-apis/nodejs/). I am talking with them and opened an issue there.

I guess we should close this

Thank you because you were on point and very very helpful. I wish you a happy weekend. If you want to add any insight I will read it even if closed