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

Changing indentation causes eslint error #1

Open
MagnusBrzenk opened this issue Sep 18, 2020 · 3 comments
Open

Changing indentation causes eslint error #1

MagnusBrzenk opened this issue Sep 18, 2020 · 3 comments

Comments

@MagnusBrzenk
Copy link

Hi. I read your article and checked out this repo. I just want to setup vscode to format my code with .eslintrc.json as the SSOT for my linting/formatting rules.

When I tried to make a simple change to your code, such as adding:

...
  "rules": {
    "prettier/prettier": "error",
    "indent": [ "error", 4 ]              // I added this
  },
...

... and then tried saving e.g. src/App.js, I got lots of eslint errors in vscode, and odd behavior whereby hitting save would toggle back and forth between 2 and 4 space indents. Would appreciate it if you checked this out and see if you got the same behvior

@doppelmutzi
Copy link
Owner

doppelmutzi commented Sep 20, 2020

hi @MagnusBrzenk, from my perspective your approach conflicts with this ESLint/Prettier Setup. You added a "ESLint formatting rule", however the whole configuration is that all formatting rules of ESLint are deactivated (by https://github.com/prettier/eslint-config-prettier) in order to not conflict with Prettier. So, the idea is to use ESLint just for static code analysis (and no formatting/prettifying) and let Prettier do the formatting work. You can read about my configuration more in an older article (Part II): https://medium.com/@doppelmutzi/eslint-prettier-vue-workflow-46a3cf54332f

The problem is that your added line is adding a ESLint formatting rule and the 4 spaces are conflicting with the 2 spaces defined by Prettier.

If you want to use this setup and want to adjust the indentation, you need to do it with the Prettier configuration. You can add a .prettierrc.json file at the root level:

{
"tabWidth": 4
}

Here you can read about the Prettier configuration options: https://prettier.io/docs/en/options.html

Let me know, if this was helpful.

@MagnusBrzenk MagnusBrzenk changed the title Changing indention causes eslint error Changing indentation causes eslint error Sep 20, 2020
@MagnusBrzenk
Copy link
Author

Thanks for getting back @doppelmutzi

In the end I discovered tsdx, and managed to get everything I wanted as reported here.

@doppelmutzi
Copy link
Owner

doppelmutzi commented Sep 21, 2020 via email

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

No branches or pull requests

2 participants