typescript/no-var-requires should only be enabled on ts/tsx files

[BPScott]

polaris-react contains both ts/tsx files (for the main codebase) and js files (for scripts / config). eslint runs over both.

Currently the typescript/no-var-requires rule is enabled for all file types, which means it complains about the use of require() in my js files. Obviously I can't use static imports in my js files.

Disabling that rule in js files should be the default so I don't need to add the exception into all projects that use this "ts for the main project, js for scripts" split.

[BPScott]

Closing this as it's kinda my fault for enabling typescript rules on js files. This can be solved by adding an override to the eslint config

"overrides": [
    {
      "files": ["*.js"],
      "rules": {
        "typescript/no-var-requires": "off"
      }
    }
]

[hegelstad]

This should be a part of @typescript-eslint/recommended, is that feasible?

Also: typo in the above snippet:

should be:

"overrides": [
    {
      "files": ["*.js"],
      "rules": {
        "@typescript-eslint/no-var-requires": "off"
      }
    }
]

[BPScott]

I don't think it makes much sense there - typescript-eslint/recommended defines a config but it doesn't say anything about what you apply that config to - it's up to you to apply the config to the correct files.

I originally raised this issue because at the time we were applying all the typescript-specific rules to all files - which in retrospect was weird and wrong (running TS linting rules over JS files makes no sense). This has since been corrected so that we only enable rules from typescript-eslint on *.{ts,tsx} files which makes more sense as we only apply TS-specific rules to typescript files. See #173 for where that change happened.

Basically instead of having an eslint config like the following - which applies TS rules to all files:

{
  "parser": "@typescript-eslint/parser",  
  "extends": [
    "SomeConfigThatAppliesToBothJSAndTSFiles",
    "@typescript-eslint/recommended"
  ]
}

Have something like the following - which only applies TS rules to TS files:

{
   "extends": [
    "SomeConfigThatAppliesToBothJSAndTSFiles"
  ],
  "overrides": [
    {
      "files": ["*.ts", "*.tsx"],
      "parser": "@typescript-eslint/parser",  
      "extends": [
        "SomeConfigThatAppliesToBothJSAndTSFiles",
        "@typescript-eslint/recommended"
      ]
    }
  ]
}