#const stringWidth = require('string-width') Error [ERR_REQUIRE_ESM]: require() of ES Module

12 messages · Page 1 of 1 (latest)

cedar wadi Jun 27, 2024, 8:06 PM

I m getting this error when I build on cloudflare, locally it build successfully

Full cloudflare log:

22:02:35.967    Cloning repository...
22:02:39.172    From https://github.com/majesticostudio/spica
22:02:39.173     * branch            336061ba35a62180912420a354a0e91d9366444a -> FETCH_HEAD
22:02:39.173    
22:02:39.264    HEAD is now at 336061b Refactor astro.config and update dependencies
22:02:39.264    
22:02:39.346    
22:02:39.347    Using v2 root directory strategy
22:02:39.370    Success: Finished cloning repository files
22:02:41.072    Checking for configuration in a wrangler.toml configuration file (BETA)
22:02:41.072    
22:02:46.950    
22:02:46.950     1169 packages installed [5.40s]
22:02:46.968    Executing user command: bun run build
22:02:47.210    $ astro build
22:02:47.873    /opt/buildhome/repo/node_modules/ansi-align/index.js:3
22:02:47.873    const stringWidth = require('string-width')
22:02:47.873                        ^
22:02:47.874    
22:02:47.874    Error [ERR_REQUIRE_ESM]: require() of ES Module /opt/buildhome/repo/node_modules/string-width/index.js from /opt/buildhome/repo/node_modules/ansi-align/index.js not supported.
22:02:47.874    Instead change the require of /opt/buildhome/repo/node_modules/string-width/index.js in /opt/buildhome/repo/node_modules/ansi-align/index.js to a dynamic import() which is available in all CommonJS modules.
22:02:47.874        at Object.<anonymous> (/opt/buildhome/repo/node_modules/ansi-align/index.js:3:21) {
22:02:47.874      code: 'ERR_REQUIRE_ESM'
22:02:47.874    }
22:02:47.874    
22:02:47.874    Node.js v18.17.1
22:02:47.879    error: script "build" exited with code 1 (SIGHUP)
22:02:47.882    Failed: Error while executing user command. Exited with error code: 1
22:02:47.890    Failed: build command exited with code: 1
22:02:48.728    Failed: error occurred while running build command

package json:

{
    "dependencies": {
        "@astrojs/alpinejs": "^0.4.0",
        "@astrojs/cloudflare": "11.0.1",
        "@astrojs/markdoc": "^0.11.1",
        "@astrojs/react": "^3.6.0",
        "@astrojs/rss": "^4.0.7",
        "@astrojs/sitemap": "^3.1.6",
        "@astrojs/tailwind": "^5.1.0",
        "@cloudflare/pages-plugin-mailchannels": "^0.1.5",
        "@googlemaps/js-api-loader": "^1.16.6",
        "@keystatic/astro": "^5.0.0",
        "@keystatic/core": "^0.5.23",
        "alpinejs": "^3.14.1",
        "astro": "^4.11.3",
        "gsap": "npm:@gsap/business@^3.12.5",
        "keen-slider": "^6.8.6",
        "keystatic-components": "^0.0.2",
        "react": "^18.3.1",
        "react-dom": "^18.3.1",
        "scroll-snap-slider": "^3.3.1"
    },
    "devDependencies": {
        "@biomejs/biome": "1.8.3",
        "@bobthered/tailwindcss-palette-generator": "^3.2.3",
        "@cloudflare/workers-types": "^4.20240620.0",
        "@iconify-json/clarity": "^1.1.13",
        "@iconify-json/ep": "^1.1.15",
        "@iconify-json/ic": "^1.1.17",
        "@iconify-json/iconamoon": "^1.1.4",
        "@iconify-json/mdi": "^1.1.67",
        "@iconify-json/ph": "^1.1.13",
        "@iconify-json/solar": "^1.1.9",
        "@tailwindcss/aspect-ratio": "^0.4.2",
        "@tailwindcss/forms": "^0.5.7",
        "@tailwindcss/typography": "^0.5.13",
        "@types/alpinejs": "^3.13.10",
        "@types/react": "^18.3.3",
        "@types/react-dom": "^18.3.0",
        "@vite-pwa/assets-generator": "^0.2.4",
        "@vite-pwa/astro": "^0.4.0",
        "astro-icon": "^1.1.0",
        "astro-robots-txt": "^1.0.0",
        "astro-seo": "^0.8.4",
        "satori": "^0.10.13",
        "sharp": "0.33.4",
        "tailwindcss": "^3.4.4",
        "workbox-window": "^7.1.0"
    },
    "overrides": {
        "gsap": "npm:@gsap/business@^3.12.5",
        "sharp": "0.33.4"
    },
    "resolutions": {
        "jackspeak": "3.1.2"
    }
}

yarn why

D:\repositories\majestico\spica>yarn why string-width
yarn why v1.22.22
[1/4] Why do we have the module "string-width"...?
[2/4] Initialising dependency graph...
warning Resolution field "jackspeak@2.1.1" is incompatible with requested version "jackspeak@^3.1.2"
[3/4] Finding dependency...
[4/4] Calculating file sizes...
=> Found "string-width@4.2.3"
info Has been hoisted to "string-width"
info Reasons this module exists
   - Hoisted from "astro#boxen#ansi-align#string-width"
   - Hoisted from "astro-seo#@astrojs#check#yargs#string-width"
   - Hoisted from "astro-seo#@astrojs#check#yargs#cliui#string-width"
   - Hoisted from "astro-seo#@astrojs#check#yargs#cliui#wrap-ansi#string-width"
info Disk size without dependencies: "124KB"
info Disk size with unique dependencies: "212KB"
info Disk size with transitive dependencies: "232KB"
info Number of shared dependencies: 4
=> Found "astro#string-width@7.1.0"
info This module exists because "astro" depends on it.
info Disk size without dependencies: "20KB"
info Disk size with unique dependencies: "120KB"
info Disk size with transitive dependencies: "140KB"
info Number of shared dependencies: 4
=> Found "boxen#string-width@5.1.2"
info This module exists because "astro#boxen" depends on it.
info Disk size without dependencies: "20KB"
info Disk size with unique dependencies: "108KB"
info Disk size with transitive dependencies: "128KB"
info Number of shared dependencies: 4
=> Found "ora#string-width@7.1.0"
info This module exists because "astro#ora" depends on it.
info Number of shared dependencies: 4
=> Found "widest-line#string-width@5.1.2"
info This module exists because "astro#boxen#widest-line" depends on it.
info Number of shared dependencies: 4
=> Found "wrap-ansi#string-width@5.1.2"
info This module exists because "astro#boxen#wrap-ansi" depends on it.
info Number of shared dependencies: 4

Does someone got the same error? (Maybe @upper horizon do you have some idea?)

Thanks

upper horizon Jun 28, 2024, 5:37 PM

Hard to tell, maybe different node versions?

cedar wadi Jun 29, 2024, 7:54 AM

Locally work even with the same node version (Node.js: 18.17.1)

now I changed overrides to

"overrides": {
        "gsap": "npm:@gsap/business@^3.12.5",
        "sharp": "0.33.4",
        "string-width": "4.2.3",
        "jackspeak": "3.1.2"
    }

and got a new error

const stripAnsi = require('strip-ansi');

Will add override for this as well, hopefully I will not have to do it for 500 packages 😅

Maybe something in my tsconfig?

{
    "extends": "astro/tsconfigs/strict",
    "compilerOptions": {
        "jsx": "react-jsx",
        "jsxImportSource": "react",
        "strictNullChecks": true,
        "baseUrl": ".",
        "paths": {
            "@/*": ["src/*"],
            "site": ["site.config.ts"]
        },
        "types": ["astro/client", "vite-plugin-pwa/vanillajs", "vite-plugin-pwa/info", "vite-plugin-pwa/pwa-assets"]
    },
    "exclude": ["node_modules", "dist", "public"]
}

cedar wadi Jun 29, 2024, 8:19 AM

solved with

"overrides": {
        "string-width": "4.1.0",
        "strip-ansi": "5.2.0"
}

Even if I don't really like the solution, feel like something missing