@max-iv/eslint-config-vue

Description

Linting rules for Max IV frontend Vue code.

General usage

For further instructions please refer to the information in the readme of the framework agnostic package: @max-iv/eslint-config

Among other things, it contains information on how to:

• Setup the linter to work with your development environment
• Use the formatter (Prettier)
• Work with the linter and formatter settings

Installation & Config

1. Install the following packages (as development dependencies):

   • @max-iv/eslint-config
   • @max-iv/eslint-config-vue

2. Extend the config in your local .eslint.config.js or equivalent:

   // eslint.config.js
   import { defineConfig } from 'eslint/config';
   
   import maxivVue from '@max-iv/eslint-config-vue';
   import maxiv from '@max-iv/eslint-config';
   
   export default defineConfig([...maxivVue, ...maxiv]);

   Pay attention to the order of importing config files. The last imported rule is the one that takes effect. The Prettier rules are imported in the maxiv rules, They need to override some rules set in the vue/recommended set.

3. It is a good idea to have the scripts ready in your package.json file:

     "scripts": {
       "lint": "eslint . --ext .js,.ts,.vue"
     },

   Please note the --ext flag in the lint script. It is needed for the linter to execute on Typescript files as well.

4. When everything is set up to your liking, run the linter by executing the following commands (it will format and lint the code, and automatically fix some of the issues found by the linter):

     npm run lint -- --fix

Rule Motivations

Here you can find motivations behind some of the Vue specific rules in this config package.

Currently we have no exceptions from the flat/recommended-error ruleset.

Version History

v1.0.0

Changing to flat/recommended-error to avoid using warnings and be compatible with other settings.

v0.1.0

Initial setup

License

GPL-3.0-or-later

Copyright

Copyright Lund University