Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add basic config for new ESLint v9 flat configs #2522

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

ghiscoding
Copy link

@ghiscoding ghiscoding commented Aug 7, 2024

Since I had myself to search for a couple of hours to find out how to migrate to the new ESLint v9 flat config eslint.config.mjs, I thought it could be good to improve the docs to help others like me to get started with the new flat config

- I had to search for a couple of hours to find out how to migrate to the new ESLint v9 flat config `eslint.config.mjs`, so I thought that I could add this to the docs to help others like me to get started with the new flat config
@jfrs
Copy link

jfrs commented Aug 14, 2024

Just in case, this is the config I have for strict type checks:

import eslintConfigPrettier from 'eslint-config-prettier';
import pluginVue from 'eslint-plugin-vue';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  ...tseslint.configs.strictTypeChecked,
  ...tseslint.configs.stylisticTypeChecked,
  ...pluginVue.configs['flat/recommended'],
  eslintConfigPrettier,
  {
    languageOptions: {
      parserOptions: {
        parser: tseslint.parser,
        projectService: true,
        extraFileExtensions: ['.vue']
      }
    }
  }
);

@ghiscoding
Copy link
Author

ghiscoding commented Aug 14, 2024

@jfrs your code does seem shorter but trying it out doesn't produce the same result on my side, if I move the eslintPrettierConfig on the top like you did (instead of completely at the bottom), then I actually get the correct rule 'vue/max-attributes-per-line': ['error', { singleline: 5 }] kicking in (it actually wasn't working correctly when Prettier was the last config)

image

but now the problem that I have is that Prettier seems to completely ignore these rules when I said and so is not in sync with the eslint prettier config, not exactly sure why though. @jfrs do you happen to know why? or how to make Prettier use the same config?

EDIT

taking another look at eslint-config-prettier docs, it seems that we have to add it after the rules so that it disables the rules that are conflicting with Prettier. So I think it's better to keep as the last prop in the flat config

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants