Skip to content

Disallow spaces inside of curly braces in JSX expressions in children (react/jsx-curly-spacing) #1373

Closed
@feross

Description

https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-curly-spacing.md

We already require no spaces inside of JSX expression in attributes, i.e. <Hello name={firstname} /> instead of <Hello name={ firstname } />.

I want to enforce the same rule for JSX expressions in children.

Before:

    "react/jsx-curly-spacing": ["error", "never"],

After:

    "react/jsx-curly-spacing": ["error", {
      "attributes": { "when": "never" },
      "children": { "when": "never" },
      "allowMultiline": true
    }],

The following patterns are considered warnings:

<Hello name={ firstname } />;
<Hello name={ firstname} />;
<Hello name={firstname } />;
<Hello>{ firstname }</Hello>;

The following patterns are not warnings:

<Hello name={firstname} />;
<Hello name={{ firstname: 'John', lastname: 'Doe' }} />;
<Hello name={
  firstname
} />;
<Hello>{firstname}</Hello>;
<Hello>{
  firstname
}</Hello>;

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions