lint: switch to using eslint directly

[alxndrsn]

• this allows the use of the --cache flag for faster repeated linting (not supported in vue-cli-service lint) see: https://cli.vuejs.org/core-plugins/eslint.html#injected-commands
• vue-cli-service is deprecated, and using eslint directly is recommended for vue 3 see: https://cli.vuejs.org/core-plugins/eslint.html see: https://vuejs.org/guide/scaling-up/tooling.html#linting

[alxndrsn]

For me this cuts repeated lint run duration from ~25s to <2s.

[matthew-white]

For me this cuts repeated lint run duration from ~25s to <2s.

I've also been noticing that linting has been pretty slow lately. Cutting down the duration like this would be a big win.

vue-cli-service is deprecated

Hoping to move to Vite (#671) before too long!

using eslint directly is recommended for vue 3 see: https://cli.vuejs.org/core-plugins/eslint.html see: https://vuejs.org/guide/scaling-up/tooling.html#linting

Are you sure this doesn't require Vite? Before listing recommendations, the second link says:

when using a Vite-based build setup, our general recommendation is:

Can you tell whether .vue files are still being linted?

• Are templates being linted? For example, if you remove <!-- eslint-disable vue/no-v-html --> from src/components/collect-qr.vue, does ESLint display an error?
• Is the JS in <script> tags being linted?

[alxndrsn]

Are you sure this doesn't require Vite?

I don't think this PR has added Vite, and it seems to work 🤔

Can you tell whether .vue files are still being linted?

• Are templates being linted? For example, if you remove <!-- eslint-disable vue/no-v-html --> from src/components/collect-qr.vue, does ESLint display an error?

• Is the JS in <script> tags being linted?

Yes & yes - check out this failing build: https://app.circleci.com/pipelines/github/getodk/central-frontend/1502/workflows/2554db3f-f934-4df5-88c3-267572382cc1/jobs/1816

> [email protected] lint
> eslint --cache --no-fix --max-warnings 0 --ext .js,.vue src/ bin/ test/ *.js


/home/circleci/repo/src/components/account/claim.vue
  41:42  error  Missing semicolon  semi

/home/circleci/repo/src/components/collect-qr.vue
  14:28  warning  'v-html' directive can lead to XSS attack  vue/no-v-html

✖ 2 problems (1 error, 1 warning)
  1 error and 0 warnings potentially fixable with the `--fix` option.


Exited with code exit status 1

[matthew-white]

I'm in the process of moving from Vue CLI to Vite (#671). As mentioned above, under Vite, eslint is used directly, so we're about to be moving in the direction of this PR anyway. Given that linting continues to work with the changes here, I think we should try to get this PR merged. There's a conflicting file, but I can resolve that now.

[matthew-white]

This looks to be an option of the ESLint plugin for Vue CLI, so I think we can remove it. From https://cli.vuejs.org/core-plugins/eslint.html#configuration:

The following option is under the section of vue.config.js. It is respected only when @vue/cli-plugin-eslint is installed.

[matthew-white]

I think this PR is ready to merge, so I'm going to go ahead and approve and merge. I've made some changes myself, though nothing big. @alxndrsn, it'd be great if you could take a look at my changes once you have the chance just to confirm that they make sense.