Linting (.eslintrc.json) overrides not working

When using a .eslintrc.json file to change the default linting rules of the editor, it does not apply any overrides; e.g. if i configure a linting rule like the below, it will give warnings in all files (even the ones that should be set to off):

{
  "rules": {
    "sort-keys": "warn"
  },
  "overrides": [
    {
      "files": ["*.config.js"],
      "rules": {
        "sort-keys": "off"
      }
    }
  ]
}

I also tried to make use of configuration cascading as an alternative. However, it does not seem like the editor uses any .eslintrc.json files placed in subdirectories.

The only thing that works is to use a configuration comment in all files where I want to set the rule to off; i.e. /* eslint sort-keys: "off" */.
This, however, also has its limitations; it only works if I want to set my rule to off. If I set a rule to warn or error, e.g. /* eslint sort-keys: "warn" */, the editor will give the following error:

Configuration for rule "sort-keys" is invalid:
Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'
      
      
      
      https://apis.google.com
      https://cdnjs.cloudflare.com
      https://cdn.segment.com
      https://*.woopra.com
      'sha256-aROmP5KBVON8dHdF7kTobxNwhI67hJuBpk+jNh/jbM4='
      'sha256-lIXJkTrfgeKmujhwsIkqzNbMkplZdPFm1ERXsf46uOw='
      'sha256-To0Iwo79L42agXa29pvaAn64gM4rwT1BflbRPGdqcUg='
      
      'sha256-IWN+DH0UXsSKPql06C66AvLM8/jMYbOe+wVRfPlzHDY='
      
      http://www.luckyorange.com https://ssl.luckyorange.com https://d10lpsik1i8c69.cloudfront.net
      
      https://www.google.com
      https://www.gstatic.com
      
      https://cdn.amplitude.com".
2 Likes

Hi there @WhiteNemo - if you go into the terminal and run refresh does it then follow your config file rules?

No, it behaves the same way even after running refresh; the rules are applied to all files even the ones that should be overridden (and the error still happens if I use comments as described).

Can you let me know the name of the project so I can take a look? If it’s private, or you just don’t want to share here, can you email glitch@support.com with the name of the project (say that I sent you!) and I’ll figure out what’s going on there.

It happens in all projects, not just one specific. It also happens if I create a project without logging in, so I do not believe it is specific to my account.
But I have created this project that illustrates all the errors. It includes comments in each file describing what happens, and what should have happened.

I’m not seeing any errors in either of those files, so something tells me something else is triggering the editor to pay attention to the config files properly. I’ll play around with this more to see why that’s going on. Do you still see errors?

Yes, still seeing them. But after seeing your photo I tried to go to the project while not logged in. When I view the project anonymously I do not see any errors or warnings (not even the sort-keys warning that should be in normal.js). However, if I remix the project and change something in a file (added and removed a space at the end of the file), it will show up, but only in the edited file.

The js linting in the editor looks like it uses this special package built for browsers. The sample I see on the readme doesn’t show where to put additional directory-specific configs, so that might be a limitation that makes the folder/file.js one not work right. That doesn’t fully explain why the some.config.js one doesn’t work, but maybe it’s another similar limitation.

Glitch looks like it has a flag to have it do linting on the server side, which I remixed your project to try to turn that on.

watch.json:

{
  "lintingEnabled": true,
  "eslint": {
    "include": [
      "\\.js$"
    ]
  }
}

But I can’t get it to run, and I can’t find any help articles on the feature.

2 Likes

Yeah I didn’t realize I needed to edit the file before the errors showed up, that’s weird! I’m asking some folks on the eng team if they can help me diagnose this for you.

1 Like

That flag won’t work in watch.json :eyes: we decided not to do linting on the back-end (and should probably remove it).

I’ll take a look at the rules needed to get it working in sub-directories the way you’d expect, @wh0 is right that we’re running a wrapper library so that it gets injected into the front end (for instant linting, instead of needing a round trip to the server)

7 Likes

Thank you @jenn and @keithk for looking into it. Hopefully it is not too difficult to implement / fix.

Big thanks to you too, @wh0, for trying to find a possible solution.

7 Likes