[Bug?]: Error [ERR_REQUIRE_ESM]: require() of ES Module string-width/index.js

[Sitting-Duck351]

Self-service

• I'd be willing to implement a fix

Describe the bug

Everything was working with string-width v3.2.3, until v5.0.1 was added to yarn.lock, after then I get:

• Error [ERR_REQUIRE_ESM]: require() of ES Module <path>/node_modules/string-width/index.js

As workaround I use NPM, which adds the name to v4.2.3 and then yarn import to generate yarn.lock, since my pipeline is all based in yarn. Or if I add name string-width to v4.2.3 manually then it works.

This issue is already reported in storybookjs github:
[https://github.com/storybookjs/storybook/issues/22431]

To reproduce

Having string-width v4.2.3 and v5.0.1 in yarn.lock, run yarn --pure-lockfile

"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
dependencies:
emoji-regex "^8.0.0"
is-fullwidth-code-point "^3.0.0"
strip-ansi "^6.0.1"

string-width@^5.0.1, string-width@^5.1.2:
version "5.1.2"
resolved "https://registry.yarnpkg.com/string-width/-/string-width-5.1.2.tgz#14f8daec6d81e7221d2a357e668cab73bdbca794"
integrity sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==
dependencies:
eastasianwidth "^0.2.0"
emoji-regex "^9.2.2"
strip-ansi "^7.0.1"

Environment

Node: 16.14.0
Yarn: 1.22.19
Npm: 8.5.0

Additional context

No response

[liemlylac]

I have an issue like this when does not have yarn.lock and node_modules/, first yarn install and everything looks fine.

But when I add a dependency Error [ERR_REQUIRE_ESM]: require() of ES Module /node_modules/string-width/index.js occurs.

The framework I used: is NestJS version ^10.0.0
Dependencies:

{
  ..
  "dependencies": {
    "@nestjs/axios": "^3.0.0",
    "@nestjs/cache-manager": "^2.1.0",
    "@nestjs/common": "^10.0.0",
    "@nestjs/config": "^3.1.1",
    "@nestjs/core": "^10.0.0",
    "@nestjs/jwt": "^10.1.1",
    "@nestjs/microservices": "^10.2.6",
    "@nestjs/platform-express": "^10.0.0",
    "@nestjs/swagger": "^7.1.12",
    "@nestjs/typeorm": "^10.0.0",
    "axios": "^1.5.1",
    "cache-manager": "^3.4.4",
    "cache-manager-redis-store": "^2.0.0",
    "cheerio": "^1.0.0-rc.12",
    "class-transformer": "^0.5.1",
    "class-validator": "^0.14.0",
    "ioredis": "^5.3.2",
    "markdown-it": "^13.0.2",
    "matrix-bot-sdk": "^0.6.6",
    "matrix-js-sdk": "^19.5.0",
    "pg": "^8.11.3",
    "redis": "^4.6.10",
    "reflect-metadata": "^0.1.13",
    "rimraf": "^5.0.5",
    "rxjs": "^7.8.1",
    "swagger-ui-express": "^5.0.0",
    "typeorm": "^0.3.17"
  },
  "devDependencies": {
    "@nestjs/cli": "^10.0.0",
    "@nestjs/schematics": "^10.0.0",
    "@nestjs/testing": "^10.0.0",
    "@types/cache-manager": "^4.0.3",
    "@types/express": "^4.17.17",
    "@types/jest": "^29.5.2",
    "@types/markdown-it": "^13.0.1",
    "@types/multer": "^1.4.7",
    "@types/node": "^20.3.1",
    "@types/supertest": "^2.0.12",
    "@typescript-eslint/eslint-plugin": "^6.0.0",
    "@typescript-eslint/parser": "^6.0.0",
    "eslint": "^8.42.0",
    "eslint-config-prettier": "^9.0.0",
    "eslint-plugin-prettier": "^5.0.0",
    "jest": "^29.5.0",
    "prettier": "^3.0.0",
    "source-map-support": "^0.5.21",
    "supertest": "^6.3.3",
    "ts-jest": "^29.1.0",
    "ts-loader": "^9.4.3",
    "ts-node": "^10.9.1",
    "tsconfig-paths": "^4.2.0",
    "typescript": "^5.1.3"
  },
  ..
}

My tsconfig.json

{
  "compilerOptions": {
    "module": "commonjs",
    "declaration": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "ES2021",
    "sourceMap": true,
    "outDir": "./dist",
    "baseUrl": "./",
    "incremental": true,
    "skipLibCheck": true,
    "strictNullChecks": false,
    "noImplicitAny": false,
    "strictBindCallApply": false,
    "forceConsistentCasingInFileNames": false,
    "noFallthroughCasesInSwitch": false
  }
}

Environment:

MacOS: 13.3.1
Node: 16.20.1
Yarn: 1.22.19

[niyodusengaclement]

I had the same issue when I was running NestJS project with docker and I was able to solve it by deleting the yarn.lock file and never copy it in the app directory in Dockfile.

Here is the example of the line I removed in the Dockfile

COPY --chown=node:node yarn.lock ./

[itzsrikanth]

I had the same issue while setting up a TS library with jest and as @niyodusengaclement mentioned, deleting yarn.lock helped.

[johannesschobel]

but this i completely against the idea from the yarn.lock file. There has to be another solution for this issue.. stumbling upon the same here..