PrettyError not supported anymore results in an error

[Martin1982]

When running yarn build the build fails for using require instead of ESM in what seems a Webpack Encore dependency;

[webpack-cli] Error [ERR_REQUIRE_ESM]: require() of ES Module /var/www/app/node_modules/strip-ansi/index.js from /var/www/app/node_modules/renderkid/lib/RenderKid.js not supported.
Instead change the require of index.js in /var/www/app/node_modules/renderkid/lib/RenderKid.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/var/www/app/node_modules/renderkid/lib/RenderKid.js:22:13)
    at Object.<anonymous> (/var/www/app/node_modules/pretty-error/lib/PrettyError.js:14:13)
    at Object.<anonymous> (/var/www/app/node_modules/@symfony/webpack-encore/lib/utils/pretty-error.js:12:21)
    at Object.<anonymous> (/var/www/app/node_modules/@symfony/webpack-encore/lib/EncoreProxy.js:14:21)
    at Object.<anonymous> (/var/www/app/node_modules/@symfony/webpack-encore/index.js:13:21)
    at Object.<anonymous> (/var/www/app/webpack.config.js:2:16) {
  code: 'ERR_REQUIRE_ESM'
}

Yarn version; yarn run v1.22.21
Webpack encore version; 4.6.1

[ErdemUyanik]

I would like to bring this up again, as no one has responded yet.

The library pretty-error from @AriaMinaei has not been updated in the past 3 years and relies on the library RenderKid.js also by @AriaMinaei

Both these libraries have not received an update in the past 3 years, in fact RenderKid.js has an open pull request to bump up the version of ansi-regex to Resolve vulnerability CVE-2021-3807.

Both these libraries are not supported anymore and cause issues when trying to use Webpack Encore.

Node version: v20.12.2
Yarn Version: 1.22.19

[stof]

Are you using some yarn resolutions to force versions of strip-ansi ? AFAICT, renderkid depends on a version of strip-ansi that is not an ES module.

[Martin1982]

You are correct that multiple dependencies rely on it;

root@852d522f7af3:/var/www/project# yarn why strip-ansi
├─ @isaacs/cliui@npm:8.0.2
│  ├─ strip-ansi@npm:6.0.1 (via npm:strip-ansi@^6.0.1)
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.0.1)
│
├─ @jest/core@npm:29.7.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ @jest/core@npm:29.7.0 [83196]
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ @jest/reporters@npm:29.7.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ @jest/reporters@npm:29.7.0 [8ede2]
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ cliui@npm:8.0.1
│  └�� strip-ansi@npm:6.0.1 (via npm:^6.0.1)
│
├─ eslint@npm:8.57.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.1)
│
├─ log-update@npm:6.0.0
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.1.0)
│
├─ renderkid@npm:3.0.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.1)
│
├─ string-length@npm:4.0.2
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ string-width@npm:4.2.3
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.1)
│
├─ string-width@npm:5.1.2
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.0.1)
│
├�� string-width@npm:7.1.0
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.1.0)
│
├─ stylelint@npm:16.5.0
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.1.0)
│
├─ table@npm:6.8.2
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.1)
│
├─ webpack-notifier@npm:1.15.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ webpack-notifier@npm:1.15.0 [dc3fc]
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ wrap-ansi@npm:7.0.0
│  └─ strip-ansi@npm:6.0.1 (via npm:^6.0.0)
│
├─ wrap-ansi@npm:8.1.0
│  └─ strip-ansi@npm:7.1.0 (via npm:^7.0.1)
│
└─ wrap-ansi@npm:9.0.0
   └─ strip-ansi@npm:7.1.0 (via npm:^7.1.0)

My project is now on Yarn 4.2.2 and runs without any issues
In my yarn.lock I found the following;

"strip-ansi@npm:^7.0.1, strip-ansi@npm:^7.1.0":
  version: 7.1.0

So even though this might be a non-issue, the comment of @ErdemUyanik about security might still be a concern to be addressed in a new issue.