Linting Is Back

[jobelenus]

So What Had Happened Was

1. We were on eslint v8, which was EOL.
2. Most of the plugins stopped working with that.
3. Now, we're on eslint v9.
4. v9 changed the configuration format entirely.
5. Both changes meant upgrading a ton of other packages as well
6. We also upgraded typescript and pinia
7. I got rid of the shared eslint-config package just to remove a bit of complexity, we can re-do that kind of thing if we want
8. Some rule names changed
9. Some new rules came in

Now—you can open the root si/ folder and get working linting. You don't need to open si/app/web or si/lib/vue-lib by itself to get linting to work.

We have some rules that I turned into warnings. I didn't want to turn them off because sometimes I want the user to see the note in case they want to take action on it. But, I also don't want them to stop a build from passing. It is a gray area.

However, there are some linting rules that are warnings (e.g. console, let not const, etc) that we don't want passing builds, but, could be really annoying in that pop-over at the bottom of the web app when developing locally?

Let's discuss!

Things I've Learned About VScode Running ESLint

1. If you do pnpm installs, it is incredibly likely you'll need to entirely close VSCode. Simpy restarting the ESLint server does not always pick up the changed packages
2. If you change the ESLint config restarting ESLint Server generally works reliably.

What this means for you: after this merges, the first time you work in one of the TS app or lib dirs you'll need to run pnpm i for all the dev package changes. And you will need to fully quit VScode and re-open it.

How was it tested?

1. VSCode working!
2. pnpm lint:fix
3. pnpm build:check
4. CI runs the linter & build check through buck2

Does it require a docs change?

Yes... here is what my VSCode setup looks like:

1. You need the ESLint plugin
2. You need the Prettier plugin
3. This my JSON settings

    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": "always",
    },
    "eslint.workingDirectories": [{ "mode": "auto" }],
    "eslint.format.enable": true,
    "eslint.lintTask.enable": true,
    "typescript.preferences.preferTypeOnlyAutoImports": false,
    "eslint.run": "onSave",
    "eslint.lintTask.options": "--ext .ts,.js,.cjs,.vue",
    "[vue]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },

NOTE: I made a new VSCode profile in order to test that, and then made it the default. You may or may not want to do that

[github-actions]

Dependency Review

The following issues were found:

• ✅ 0 vulnerable package(s)
• ⚠️ 2 packages with OpenSSF Scorecard issues.

View full job summary

[jkeiser]

<3 that it allows longer lines, I felt we broke them up too much

[vbustamante]

Works wonders, great fix

[jkeiser]

Weird that it didn't remove the unnecessary parens too

[jkeiser]

This looks good. I looked through the .ts files and the lint config, and it's really good! Very happy with line length being smaller :)

I think we need to make sure warnings don't make their way into main, and it looks like this won't detect that? But this is way less painful than our existing situation.

We should follow up fast with something that prevents warnings in main, but not block this and let your work rot.