0

Does anyone know which ESLint configuration rule is causing my jsx inside parenthesis to be 4 more spaces on the left then I expect?

import React from 'react';

import './styles.scss';

const TableWrapper = ({
    children,
}) => (
        <div className="table-wrapper">
            {children}
        </div>
    );

export default TableWrapper;

Using eslint:recommended, plugin:react/recommended, and eslint-config-prettier

AndrewHipp
  • 379
  • 2
  • 6

1 Answers1

0

It has nothing to do with the eslint. Spaces between and so on, is your prettier. I would suggest you create a .prettierrc file in the root folder and play with the settings. Here is a basic example of what you can copy paste into the file

{
 "endOfLine": "lf",
 "semi": true,
 "singleQuote": true,
 "tabWidth": 2,
 "trailingComma": "es5",
}

In your case, the tabWidth will affect how much spaces there is between your parentheses

jonask
  • 679
  • 2
  • 6
  • 21
  • Thank you for responding. I don't think this is prettier. I have a `. prettierrc` with `"tabWidth": 4`. My spacing everywhere else looks correct, it's just in `jsx` inside parenthesis. – AndrewHipp Jan 14 '20 at 19:47