tomchentw/medium-editor-tc-mention

View on GitHub

Showing 88 of 88 total issues

Function hidePanel has a Cognitive Complexity of 24 (exceeds 5 allowed). Consider refactoring.
Open

  hidePanel(isArrowTowardsLeft) {
    this.mentionPanel.classList.remove(`medium-editor-mention-panel-active`);
    const extraActivePanelClassName = this.extraActivePanelClassName || this.extraActiveClassName;

    if (extraActivePanelClassName) {
Severity: Minor
Found in src/index.js - About 3 hrs to fix

Cognitive Complexity

Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

A method's cognitive complexity is based on a few simple rules:

  • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
  • Code is considered more complex for each "break in the linear flow of the code"
  • Code is considered more complex when "flow breaking structures are nested"

Further reading

File index.js has 267 lines of code (exceeds 250 allowed). Consider refactoring.
Open

import {
  default as MediumEditor,
} from "medium-editor";

function last(text) {
Severity: Minor
Found in src/index.js - About 2 hrs to fix

    Function hidePanel has 47 lines of code (exceeds 25 allowed). Consider refactoring.
    Open

      hidePanel(isArrowTowardsLeft) {
        this.mentionPanel.classList.remove(`medium-editor-mention-panel-active`);
        const extraActivePanelClassName = this.extraActivePanelClassName || this.extraActiveClassName;
    
        if (extraActivePanelClassName) {
    Severity: Minor
    Found in src/index.js - About 1 hr to fix

      Line 84 exceeds the maximum line length of 100.
      Open

                <p>I give Pirrip as my father’s family name, on the authority of his tombstone and my sister,—Mrs. Joe Gargery, who married the blacksmith. As I never saw my father or my mother, and never saw any likeness of either of them (for their days were long before the days of photographs), my first fancies regarding what they were like were unreasonably derived from their tombstones. The shape of the letters on my father’s, gave me an odd idea that he was a square, stout, dark man, with curly black hair. From the character and turn of the inscription, “Also Georgiana Wife of the Above,” I drew a childish conclusion that my mother was freckled and sickly. To five little stone lozenges, each about a foot and a half long, which were arranged in a neat row beside their grave, and were sacred to the memory of five little brothers of mine,—who gave up trying to get a living, exceedingly early in that universal struggle,—I am indebted for a belief I religiously entertained that they had all been born on their backs with their hands in their trousers-pockets, and had never taken them out in this state of existence.</p>
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js by eslint

      enforce a maximum line length (max-len)

      Very long lines of code in any language can be difficult to read. In order to aid in readability and maintainability many coders have developed a convention to limit lines of code to X number of characters (traditionally 80 characters).

      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" }; // very long

      Rule Details

      This rule enforces a maximum line length to increase code readability and maintainability. The length of a line is defined as the number of Unicode characters in the line.

      Options

      This rule has a number or object option:

      • "code" (default 80) enforces a maximum line length
      • "tabWidth" (default 4) specifies the character width for tab characters
      • "comments" enforces a maximum line length for comments; defaults to value of code
      • "ignorePattern" ignores lines matching a regular expression; can only match a single line and need to be double escaped when written in YAML or JSON
      • "ignoreComments": true ignores all trailing comments and comments on their own line
      • "ignoreTrailingComments": true ignores only trailing comments
      • "ignoreUrls": true ignores lines that contain a URL
      • "ignoreStrings": true ignores lines that contain a double-quoted or single-quoted string
      • "ignoreTemplateLiterals": true ignores lines that contain a template literal
      • "ignoreRegExpLiterals": true ignores lines that contain a RegExp literal

      code

      Examples of incorrect code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };

      Examples of correct code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = {
        "bar": "This is a bar.",
        "baz": { "qux": "This is a qux" },
        "easier": "to read"
      };

      tabWidth

      Examples of incorrect code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" } };

      Examples of correct code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = {
      \t  \t  \t  \t  "bar": "This is a bar.",
      \t  \t  \t  \t  "baz": { "qux": "This is a qux" }
      \t  \t  };

      comments

      Examples of incorrect code for this rule with the { "comments": 65 } option:

      /*eslint max-len: ["error", { "comments": 65 }]*/
      
      /**
       * This is a comment that violates the maximum line length we have specified
      **/

      ignoreComments

      Examples of correct code for this rule with the { "ignoreComments": true } option:

      /*eslint max-len: ["error", { "ignoreComments": true }]*/
      
      /**
       * This is a really really really really really really really really really long comment
      **/

      ignoreTrailingComments

      Examples of correct code for this rule with the { "ignoreTrailingComments": true } option:

      /*eslint max-len: ["error", { "ignoreTrailingComments": true }]*/
      
      var foo = 'bar'; // This is a really really really really really really really long comment

      ignoreUrls

      Examples of correct code for this rule with the { "ignoreUrls": true } option:

      /*eslint max-len: ["error", { "ignoreUrls": true }]*/
      
      var url = 'https://www.example.com/really/really/really/really/really/really/really/long';

      ignoreStrings

      Examples of correct code for this rule with the { "ignoreStrings": true } option:

      /*eslint max-len: ["error", { "ignoreStrings": true }]*/
      
      var longString = 'this is a really really really really really long string!';

      ignoreTemplateLiterals

      Examples of correct code for this rule with the { "ignoreTemplateLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreTemplateLiterals": true }]*/
      
      var longTemplateLiteral = `this is a really really really really really long template literal!`;

      ignoreRegExpLiterals

      Examples of correct code for this rule with the { "ignoreRegExpLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreRegExpLiterals": true }]*/
      
      var longRegExpLiteral = /this is a really really really really really long regular expression!/;

      ignorePattern

      Examples of correct code for this rule with the { "ignorePattern": true } option:

      /*eslint max-len: ["error", { "ignorePattern": "^\\s*var\\s.+=\\s*require\\s*\\(/" }]*/
      
      var dep = require('really/really/really/really/really/really/really/really/long/module');

      Related Rules

      • [complexity](complexity.md)
      • [max-depth](max-depth.md)
      • [max-nested-callbacks](max-nested-callbacks.md)
      • [max-params](max-params.md)
      • [max-statements](max-statements.md) Source: http://eslint.org/docs/rules/

      Line 85 exceeds the maximum line length of 100.
      Open

                <p>Ours was the marsh country, down by the river, within, as the river wound, twenty miles of the sea. My first most vivid and broad impression of the identity of things seems to me to have been gained on a memorable raw afternoon towards evening. At such a time I found out for certain that this bleak place overgrown with nettles was the churchyard; and that Philip Pirrip, late of this parish, and also Georgiana wife of the above, were dead and buried; and that Alexander, Bartholomew, Abraham, Tobias, and Roger, infant children of the aforesaid, were also dead and buried; and that the dark flat wilderness beyond the churchyard, intersected with dikes and mounds and gates, with scattered cattle feeding on it, was the marshes; and that the low leaden line beyond was the river; and that the distant savage lair from which the wind was rushing was the sea; and that the small bundle of shivers growing afraid of it all and beginning to cry, was Pip.</p>
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js by eslint

      enforce a maximum line length (max-len)

      Very long lines of code in any language can be difficult to read. In order to aid in readability and maintainability many coders have developed a convention to limit lines of code to X number of characters (traditionally 80 characters).

      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" }; // very long

      Rule Details

      This rule enforces a maximum line length to increase code readability and maintainability. The length of a line is defined as the number of Unicode characters in the line.

      Options

      This rule has a number or object option:

      • "code" (default 80) enforces a maximum line length
      • "tabWidth" (default 4) specifies the character width for tab characters
      • "comments" enforces a maximum line length for comments; defaults to value of code
      • "ignorePattern" ignores lines matching a regular expression; can only match a single line and need to be double escaped when written in YAML or JSON
      • "ignoreComments": true ignores all trailing comments and comments on their own line
      • "ignoreTrailingComments": true ignores only trailing comments
      • "ignoreUrls": true ignores lines that contain a URL
      • "ignoreStrings": true ignores lines that contain a double-quoted or single-quoted string
      • "ignoreTemplateLiterals": true ignores lines that contain a template literal
      • "ignoreRegExpLiterals": true ignores lines that contain a RegExp literal

      code

      Examples of incorrect code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };

      Examples of correct code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = {
        "bar": "This is a bar.",
        "baz": { "qux": "This is a qux" },
        "easier": "to read"
      };

      tabWidth

      Examples of incorrect code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" } };

      Examples of correct code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = {
      \t  \t  \t  \t  "bar": "This is a bar.",
      \t  \t  \t  \t  "baz": { "qux": "This is a qux" }
      \t  \t  };

      comments

      Examples of incorrect code for this rule with the { "comments": 65 } option:

      /*eslint max-len: ["error", { "comments": 65 }]*/
      
      /**
       * This is a comment that violates the maximum line length we have specified
      **/

      ignoreComments

      Examples of correct code for this rule with the { "ignoreComments": true } option:

      /*eslint max-len: ["error", { "ignoreComments": true }]*/
      
      /**
       * This is a really really really really really really really really really long comment
      **/

      ignoreTrailingComments

      Examples of correct code for this rule with the { "ignoreTrailingComments": true } option:

      /*eslint max-len: ["error", { "ignoreTrailingComments": true }]*/
      
      var foo = 'bar'; // This is a really really really really really really really long comment

      ignoreUrls

      Examples of correct code for this rule with the { "ignoreUrls": true } option:

      /*eslint max-len: ["error", { "ignoreUrls": true }]*/
      
      var url = 'https://www.example.com/really/really/really/really/really/really/really/long';

      ignoreStrings

      Examples of correct code for this rule with the { "ignoreStrings": true } option:

      /*eslint max-len: ["error", { "ignoreStrings": true }]*/
      
      var longString = 'this is a really really really really really long string!';

      ignoreTemplateLiterals

      Examples of correct code for this rule with the { "ignoreTemplateLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreTemplateLiterals": true }]*/
      
      var longTemplateLiteral = `this is a really really really really really long template literal!`;

      ignoreRegExpLiterals

      Examples of correct code for this rule with the { "ignoreRegExpLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreRegExpLiterals": true }]*/
      
      var longRegExpLiteral = /this is a really really really really really long regular expression!/;

      ignorePattern

      Examples of correct code for this rule with the { "ignorePattern": true } option:

      /*eslint max-len: ["error", { "ignorePattern": "^\\s*var\\s.+=\\s*require\\s*\\(/" }]*/
      
      var dep = require('really/really/really/really/really/really/really/really/long/module');

      Related Rules

      • [complexity](complexity.md)
      • [max-depth](max-depth.md)
      • [max-nested-callbacks](max-nested-callbacks.md)
      • [max-params](max-params.md)
      • [max-statements](max-statements.md) Source: http://eslint.org/docs/rules/

      Function componentDidMount has 32 lines of code (exceeds 25 allowed). Consider refactoring.
      Open

        componentDidMount () {
          const MediumEditor = require("medium-editor");
          const { TCMention } = require("medium-editor-tc-mention");
      
          this.editor = new MediumEditor(this.refs.editable, {
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js - About 1 hr to fix

        Function wrapWordInMentionAt has 30 lines of code (exceeds 25 allowed). Consider refactoring.
        Open

          wrapWordInMentionAt() {
            const selection = this.document.getSelection();
            if (!selection.rangeCount) {
              return;
            }
        Severity: Minor
        Found in src/index.js - About 1 hr to fix

          Function getWordFromSelection has 27 lines of code (exceeds 25 allowed). Consider refactoring.
          Open

            getWordFromSelection(target, initialDiff) {
              const {
                startContainer,
                startOffset,
                endContainer,
          Severity: Minor
          Found in src/index.js - About 1 hr to fix

            Function getWordFromSelection has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.
            Open

              getWordFromSelection(target, initialDiff) {
                const {
                  startContainer,
                  startOffset,
                  endContainer,
            Severity: Minor
            Found in src/index.js - About 25 mins to fix

            Cognitive Complexity

            Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

            A method's cognitive complexity is based on a few simple rules:

            • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
            • Code is considered more complex for each "break in the linear flow of the code"
            • Code is considered more complex when "flow breaking structures are nested"

            Further reading

            Function wrapWordInMentionAt has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.
            Open

              wrapWordInMentionAt() {
                const selection = this.document.getSelection();
                if (!selection.rangeCount) {
                  return;
                }
            Severity: Minor
            Found in src/index.js - About 25 mins to fix

            Cognitive Complexity

            Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

            A method's cognitive complexity is based on a few simple rules:

            • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
            • Code is considered more complex for each "break in the linear flow of the code"
            • Code is considered more complex when "flow breaking structures are nested"

            Further reading

            Unexpected space(s) after '${'.
            Open

            ).map(key => new RegExp(`^${ key }`));

            Enforce Usage of Spacing in Template Strings (template-curly-spacing)

            We can embed expressions in template strings with using a pair of ${ and }.

            This rule can force usage of spacing within the curly brace pair according to style guides.

            let hello = `hello, ${people.name}!`;

            Rule Details

            This rule aims to maintain consistency around the spacing inside of template literals.

            Options

            {
                "template-curly-spacing": ["error", "never"]
            }

            This rule has one option which has either "never" or "always" as value.

            • "never" (by default) - Disallows spaces inside of the curly brace pair.
            • "always" - Requires one or more spaces inside of the curly brace pair.

            Examples

            never

            Examples of incorrect code for this rule with the default "never" option:

            /*eslint template-curly-spacing: "error"*/
            
            `hello, ${ people.name}!`;
            `hello, ${people.name }!`;
            
            `hello, ${ people.name }!`;

            Examples of correct code for this rule with the default "never" option:

            /*eslint template-curly-spacing: "error"*/
            
            `hello, ${people.name}!`;
            
            `hello, ${
                people.name
            }!`;

            always

            Examples of incorrect code for this rule with the "always" option:

            /*eslint template-curly-spacing: ["error", "always"]*/
            
            `hello, ${ people.name}!`;
            `hello, ${people.name }!`;
            
            `hello, ${people.name}!`;

            Examples of correct code for this rule with the "always" option:

            /*eslint template-curly-spacing: ["error", "always"]*/
            
            `hello, ${ people.name }!`;
            
            `hello, ${
                people.name
            }!`;

            When Not To Use It

            If you don't want to be notified about usage of spacing inside of template strings, then it's safe to disable this rule. Source: http://eslint.org/docs/rules/

            Unexpected string concatenation.
            Open

                  <button onClick={() => props.selectMentionCallback(trigger + "mention")}>
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            Suggest using template literals instead of string concatenation. (prefer-template)

            In ES2015 (ES6), we can use template literals instead of string concatenation.

            var str = "Hello, " + name + "!";
            /*eslint-env es6*/
            
            var str = `Hello, ${name}!`;

            Rule Details

            This rule is aimed to flag usage of + operators with strings.

            Examples

            Examples of incorrect code for this rule:

            /*eslint prefer-template: "error"*/
            
            var str = "Hello, " + name + "!";
            var str = "Time: " + (12 * 60 * 60 * 1000);

            Examples of correct code for this rule:

            /*eslint prefer-template: "error"*/
            /*eslint-env es6*/
            
            var str = "Hello World!";
            var str = `Hello, ${name}!`;
            var str = `Time: ${12 * 60 * 60 * 1000}`;
            
            // This is reported by `no-useless-concat`.
            var str = "Hello, " + "World!";

            When Not To Use It

            This rule should not be used in ES3/5 environments.

            In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.

            Related Rules

            Strings must use backtick.
            Open

                const MediumEditor = require("medium-editor");
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            enforce the consistent use of either backticks, double, or single quotes (quotes)

            JavaScript allows you to define strings in one of three ways: double quotes, single quotes, and backticks (as of ECMAScript 6). For example:

            /*eslint-env es6*/
            
            var double = "double";
            var single = 'single';
            var backtick = `backtick`;    // ES6 only

            Each of these lines creates a string and, in some cases, can be used interchangeably. The choice of how to define strings in a codebase is a stylistic one outside of template literals (which allow embedded of expressions to be interpreted).

            Many codebases require strings to be defined in a consistent manner.

            Rule Details

            This rule enforces the consistent use of either backticks, double, or single quotes.

            Options

            This rule has two options, a string option and an object option.

            String option:

            • "double" (default) requires the use of double quotes wherever possible
            • "single" requires the use of single quotes wherever possible
            • "backtick" requires the use of backticks wherever possible

            Object option:

            • "avoidEscape": true allows strings to use single-quotes or double-quotes so long as the string contains a quote that would have to be escaped otherwise
            • "allowTemplateLiterals": true allows strings to use backticks

            Deprecated: The object property avoid-escape is deprecated; please use the object property avoidEscape instead.

            double

            Examples of incorrect code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            
            var single = 'single';
            var unescaped = 'a string containing "double" quotes';

            Examples of correct code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            /*eslint-env es6*/
            
            var double = "double";
            var backtick = `back\ntick`;  // backticks are allowed due to newline
            var backtick = tag`backtick`; // backticks are allowed due to tag

            single

            Examples of incorrect code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            
            var double = "double";
            var unescaped = "a string containing 'single' quotes";

            Examples of correct code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            /*eslint-env es6*/
            
            var single = 'single';
            var backtick = `back${x}tick`; // backticks are allowed due to substitution

            backticks

            Examples of incorrect code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            
            var single = 'single';
            var double = "double";
            var unescaped = 'a string containing `backticks`';

            Examples of correct code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            /*eslint-env es6*/
            
            var backtick = `backtick`;

            avoidEscape

            Examples of additional correct code for this rule with the "double", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "double", { "avoidEscape": true }]*/
            
            var single = 'a string containing "double" quotes';

            Examples of additional correct code for this rule with the "single", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "single", { "avoidEscape": true }]*/
            
            var double = "a string containing 'single' quotes";

            Examples of additional correct code for this rule with the "backtick", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "backtick", { "avoidEscape": true }]*/
            
            var double = "a string containing `backtick` quotes"

            allowTemplateLiterals

            Examples of additional correct code for this rule with the "double", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "double", { "allowTemplateLiterals": true }]*/
            
            var double = "double";
            var double = `double`;

            Examples of additional correct code for this rule with the "single", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "single", { "allowTemplateLiterals": true }]*/
            
            var single = 'single';
            var single = `single`;

            When Not To Use It

            If you do not need consistency in your string styles, you can safely disable this rule. Source: http://eslint.org/docs/rules/

            img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.
            Open

                      <p><a href="http://google.com"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150" /></a></p>
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            Use default import syntax to import 'ReactRoot'.
            Open

            import {default as ReactRoot} from "./ReactRoot";
            Severity: Minor
            Found in examples/gh-pages/src/server.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            Unexpected space before function parentheses.
            Open

              render () {
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            Require or disallow a space before function parenthesis (space-before-function-paren)

            When formatting a function, whitespace is allowed between the function name or function keyword and the opening paren. Named functions also require a space between the function keyword and the function name, but anonymous functions require no whitespace. For example:

            function withoutSpace(x) {
                // ...
            }
            
            function withSpace (x) {
                // ...
            }
            
            var anonymousWithoutSpace = function() {};
            
            var anonymousWithSpace = function () {};

            Style guides may require a space after the function keyword for anonymous functions, while others specify no whitespace. Similarly, the space after a function name may or may not be required.

            Rule Details

            This rule aims to enforce consistent spacing before function parentheses and as such, will warn whenever whitespace doesn't match the preferences specified.

            Options

            This rule has a string option or an object option:

            {
                "space-before-function-paren": ["error", "always"],
                // or
                "space-before-function-paren": ["error", {
                    "anonymous": "always",
                    "named": "always",
                    "asyncArrow": "ignore"
                }],
            }
            • always (default) requires a space followed by the ( of arguments.
            • never disallows any space followed by the ( of arguments.

            The string option does not check async arrow function expressions for backward compatibility.

            You can also use a separate option for each type of function. Each of the following options can be set to "always", "never", or "ignore". Default is "always" basically.

            • anonymous is for anonymous function expressions (e.g. function () {}).
            • named is for named function expressions (e.g. function foo () {}).
            • asyncArrow is for async arrow function expressions (e.g. async () => {}). asyncArrow is set to "ignore" by default for backwards compatibility.

            "always"

            Examples of incorrect code for this rule with the default "always" option:

            /*eslint space-before-function-paren: "error"*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            var bar = function foo() {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the default "always" option:

            /*eslint space-before-function-paren: "error"*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            var bar = function foo () {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };
            
            // async arrow function expressions are ignored by default.
            var foo = async () => 1
            var foo = async() => 1

            "never"

            Examples of incorrect code for this rule with the "never" option:

            /*eslint space-before-function-paren: ["error", "never"]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            var bar = function foo () {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            Examples of correct code for this rule with the "never" option:

            /*eslint space-before-function-paren: ["error", "never"]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            var bar = function foo() {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };
            
            // async arrow function expressions are ignored by default.
            var foo = async () => 1
            var foo = async() => 1

            {"anonymous": "always", "named": "never", "asyncArrow": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "always", "named": "never", "asyncArrow": "always"} option:

            /*eslint space-before-function-paren: ["error", {"anonymous": "always", "named": "never", "asyncArrow": "always"}]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };
            
            var foo = async(a) => await a

            Examples of correct code for this rule with the {"anonymous": "always", "named": "never", "asyncArrow": "always"} option:

            /*eslint space-before-function-paren: ["error", {"anonymous": "always", "named": "never", "asyncArrow": "always"}]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };
            
            var foo = async (a) => await a

            {"anonymous": "never", "named": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "never", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "never", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the {"anonymous": "never", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "never", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            {"anonymous": "ignore", "named": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "ignore", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "ignore", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the {"anonymous": "ignore", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "ignore", "named": "always" }]*/
            /*eslint-env es6*/
            
            var bar = function() {
                // ...
            };
            
            var bar = function () {
                // ...
            };
            
            function foo () {
                // ...
            }
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            When Not To Use It

            You can turn this rule off if you are not concerned with the consistency of spacing before function parenthesis.

            Related Rules

            A space is required before closing bracket
            Open

                  <meta name="viewport" content="width=device-width, initial-scale=1"/>

            For more information visit Source: http://eslint.org/docs/rules/

            Use default import syntax to import 'webpack'.
            Open

              default as webpack,
            Severity: Minor
            Found in webpack.config.babel.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            Use default import syntax to import 'MediumEditor'.
            Open

              default as MediumEditor,
            Severity: Minor
            Found in src/index.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            A space is required after '{'.
            Open

            import {default as ReactRoot} from "./ReactRoot";
            Severity: Minor
            Found in examples/gh-pages/src/client.js by eslint

            enforce consistent spacing inside braces (object-curly-spacing)

            While formatting preferences are very personal, a number of style guides require or disallow spaces between curly braces in the following situations:

            // simple object literals
            var obj = { foo: "bar" };
            
            // nested object literals
            var obj = { foo: { zoo: "bar" } };
            
            // destructuring assignment (EcmaScript 6)
            var { x, y } = y;
            
            // import/export declarations (EcmaScript 6)
            import { foo } from "bar";
            export { foo };

            Rule Details

            This rule enforce consistent spacing inside braces of object literals, destructuring assignments, and import/export specifiers.

            Options

            This rule has two options, a string option and an object option.

            String option:

            • "never" (default) disallows spacing inside of braces
            • "always" requires spacing inside of braces (except {})

            Object option:

            • "arraysInObjects": true requires spacing inside of braces of objects beginning and/or ending with an array element (applies when the first option is set to never)
            • "arraysInObjects": false disallows spacing inside of braces of objects beginning and/or ending with an array element (applies when the first option is set to always)
            • "objectsInObjects": true requires spacing inside of braces of objects beginning and/or ending with an object element (applies when the first option is set to never)
            • "objectsInObjects": false disallows spacing inside of braces of objects beginning and/or ending with an object element (applies when the first option is set to always)

            never

            Examples of incorrect code for this rule with the default "never" option:

            /*eslint object-curly-spacing: ["error", "never"]*/
            
            var obj = { 'foo': 'bar' };
            var obj = {'foo': 'bar' };
            var obj = { baz: {'foo': 'qux'}, bar};
            var obj = {baz: { 'foo': 'qux'}, bar};
            var {x } = y;
            import { foo } from 'bar';

            Examples of correct code for this rule with the default "never" option:

            /*eslint object-curly-spacing: ["error", "never"]*/
            
            var obj = {'foo': 'bar'};
            var obj = {'foo': {'bar': 'baz'}, 'qux': 'quxx'};
            var obj = {
              'foo': 'bar'
            };
            var obj = {'foo': 'bar'
            };
            var obj = {
              'foo':'bar'};
            var obj = {};
            var {x} = y;
            import {foo} from 'bar';

            always

            Examples of incorrect code for this rule with the "always" option:

            /*eslint object-curly-spacing: ["error", "always"]*/
            
            var obj = {'foo': 'bar'};
            var obj = {'foo': 'bar' };
            var obj = { baz: {'foo': 'qux'}, bar};
            var obj = {baz: { 'foo': 'qux' }, bar};
            var obj = {'foo': 'bar'
            };
            var obj = {
              'foo':'bar'};
            var {x} = y;
            import {foo } from 'bar';

            Examples of correct code for this rule with the "always" option:

            /*eslint object-curly-spacing: ["error", "always"]*/
            
            var obj = {};
            var obj = { 'foo': 'bar' };
            var obj = { 'foo': { 'bar': 'baz' }, 'qux': 'quxx' };
            var obj = {
              'foo': 'bar'
            };
            var { x } = y;
            import { foo } from 'bar';

            arraysInObjects

            Examples of additional correct code for this rule with the "never", { "arraysInObjects": true } options:

            /*eslint object-curly-spacing: ["error", "never", { "arraysInObjects": true }]*/
            
            var obj = {"foo": [ 1, 2 ] };
            var obj = {"foo": [ "baz", "bar" ] };

            Examples of additional correct code for this rule with the "always", { "arraysInObjects": false } options:

            /*eslint object-curly-spacing: ["error", "always", { "arraysInObjects": false }]*/
            
            var obj = { "foo": [ 1, 2 ]};
            var obj = { "foo": [ "baz", "bar" ]};

            objectsInObjects

            Examples of additional correct code for this rule with the "never", { "objectsInObjects": true } options:

            /*eslint object-curly-spacing: ["error", "never", { "objectsInObjects": true }]*/
            
            var obj = {"foo": {"baz": 1, "bar": 2} };

            Examples of additional correct code for this rule with the "always", { "objectsInObjects": false } options:

            /*eslint object-curly-spacing: ["error", "always", { "objectsInObjects": false }]*/
            
            var obj = { "foo": { "baz": 1, "bar": 2 }};

            When Not To Use It

            You can turn this rule off if you are not concerned with the consistency of spacing between curly braces.

            Related Rules

            Severity
            Category
            Status
            Source
            Language