Eslint is linting node_modules in Github Actions but not locally

Question

I try to build a Github action pipeline for my Angular project. One of the steps should be linting, but in the action, eslint is somehow trying to lint files in the node_modules folder. Locally it works like it should. I tried adding node_modules in the .eslintignore, adding ignorePatterns: ["**/node_modules/**"] into my .eslintrc and running the lint command with the --lint-file-patterns=src/ flag, to only lint the files I wrote.

Here is my current workflow.yml:

name: Build angular project
on:
  push:
    branches: [development]
  workflow_dispatch:
jobs: 
  build-angular-app:
    runs-on:
      group: my-group
    container: 
      image: node:latest
    defaults:
      run:
        working-directory: ./frontend
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Create .npmrc
        shell: bash
        run: |
          # creating my .npmrc to connect to an artifactory
        
      - name: Install packages
        run: yarn install --frozen-lockfile

      - name: Linting 
        run: yarn lint --lint-file-patterns=src/

      - name: Testing
        run: yarn test:headless:app

The .eslintignore:

test.ts
auth/**
node_modules/
node_modules/**/*

And my .eslintrc.json

{
  "root": true,
  "ignorePatterns": [
    "projects/**/*",
    "*/node_modules/**/*"
  ],
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:@angular-eslint/recommended",
        "plugin:@angular-eslint/template/process-inline-templates"
      ],
      "rules": {
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "app",
            "style": "camelCase"
          }
        ],
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "app",
            "style": "kebab-case"
          }
        ]
      }
    },
    {
      "files": [
        "*.html"
      ],
      "extends": [
        "plugin:@angular-eslint/template/recommended",
        "plugin:@angular-eslint/template/accessibility"
      ],
      "rules": {}
    }
  ]
}

And here is the linting error:

Unknown error: Error [ERR_REQUIRE_ESM]: require() of ES Module /__w/my-application/my-application/frontend/node_modules/string-width/index.js from /__w/my-application/my-application/frontend/node_modules/yargs/node_modules/cliui/build/index.cjs not supported.

I checked if the checkout works and all the files are in the correct folder. The only thing I can think of is that eslint get's confused by the workflows folder structure.

Thanks for your help!

EDIT: Sorry I am stupid.. The error has nothing to do with ESLint, but with different Node versions locally and in the workflow. Sorry for that.

Answer 1

The issue was not with the eslint configurarion, or with the container, but with a broken peer dependency. The current workaround is to remove the yarn.lock from the repo. Issue see: https://github.com/iarna/wide-align/issues/63