require() of ES Module \node_modules\string-width\index.js from \node_modules\wide-align\align.js not supported
Asked Answered
Q

1

7

`#11 44.55 ERROR require() of ES Module /app/node_modules/string-width/index.js from /app/node_modules/wide-align/align.js not supported. #11 44.55 Instead change the require of index.js in /app/node_modules/wide-align/align.js to a dynamic import() which is available in all CommonJS modules. #11 44.55 #11 44.55 Instead change the require of index.js in node_modules/wide-align/align.js to a dynamic import() which is available in all CommonJS modules. #11 44.55 at Object. (node_modules/wide-align/align.js:2:19)

#11 44.55 ERROR require() of ES Module /app/node_modules/string-width/index.js from /app/node_modules/wide-align/align.js not supported. #11 44.55 Instead change the require of index.js in /app/node_modules/wide-align/align.js to a dynamic import() which is available in all CommonJS modules. #11 44.55 #11 44.57 error Command failed with exit code 1. #11 44.57 info Visit https://yarnpkg.com/en/docs/cli/install for `


The issue here seems to be caused by your package manager.

Now I refresh the lock-file multiple times. Take the Stackblitz - I refresh the lockfile there, and it works, but then I copy that lockfile locally and the issue persists there, while I refresh locally (and small chances it doesn't help) and copy to Stackblitz, then the container fails.

The actual version of string-width installed by yarn is v5 which seems to be incompatible with wide-align. I'm afraid this isn't a Nuxt issue we can resolve.

although using the resolution, removing the yarn.lock and node_modules folder, it worked, even though it warned against an incompatibility between requested versions.

wide-align, which is used by npmlog, which is used by vite, eventually, forces the use of string-width<5, which from what I understand, was a dependency that yarn failed to comply with, causing the error.

from wide-align package.json:

"//": "But not version 5 of string-width, as that's ESM only", "dependencies": { "string-width": "^1.0.2 || 2 || 3 || 4"

Again, using the resolutions seems to be working, as long as you don't have a breaking dependency with the string-width ^5, it should be fine, but it can be really annoying. Wide-align has been inactive for over 2 years now, I doubt we will have a fix from them anytime soon. I might make a PR later to fix it

Quinn answered 14/2 at 4:57 Comment(0)
Q
10

Add this line in Your Package.json

"resolutions": { "string-width": "4.2.3" }

OR

"resolutions": { "jackspeak": "2.1.1" }

And Do this

Remove node_modules folder and yarn.lock package.lock files. Run npm/yarn install.

Quinn answered 14/2 at 4:58 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.