Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jsx indentation conflict vscode and eslint

Eslint(airbnb config) wants to have my params on new lines when I have multiple params. But when I do that, vscode formatting keeps giving 4 spaces indentation instead of 2 as expected.

Result:

const Example = ({
  param1,
  param2,
  param3,
}) => (
    <div>
      {param1} {param2} {param3}
    </div>
  );

expected:

const Example = ({
  param1,
  param2,
  param3,
}) => (
  <div>
    {param1} {param2} {param3}
  </div>
);

Is there a setting I can use in vscode to get the expected behavior?

like image 760
Rob Indesteege Avatar asked Feb 07 '18 22:02

Rob Indesteege


1 Answers

You can avoid conflicting rules by using eslint-config-prettier or preferably prettier-eslint integration. This integration will use eslint config for formatting the rules and there won't be any conflicts.

If you are using VS Code, there is a config option for prettier-vscode

like image 184
Black Avatar answered Nov 04 '22 20:11

Black