Have Prettier remove after async keyword

Question

I am working on a VueJs project and i use eslint and Prettier in VSCode. The problem that i am having is that eslint doesnt want a space after the async keyword nut Prettier does. So when vue-cli-service serve builds the source it complains that prettier wants a space after async, if i add it manually then eslint throws errors that it doesnt want a space after async.

Prettier formats:

export const myFunction = async (...args) => {};

Eslint expects:

export const myFunction = async(...args) => {};

I want to tell Prettier to NOT have a space after the async keyword OR tell eslint to ignore the space after the async keyword, any suggestions?

user_1784477 · Answer

I actually just found a forum question with an answer that fixed my problem. In the .eslintrc.js file you can add a rule as follows:

'space-before-function-paren': [
      'error',
      {
        anonymous: 'never',
        named: 'never',
        asyncArrow: 'always'
      }
    ]

The asyncArrow: 'always' rule fixed the compiler errors.

user_76173 · Answer

For Prettier not to conflict with ESLint, all ESLint's formatting-related rules should be disabled. See https://prettier.io/docs/en/integrating-with-linters.html

Have Prettier remove <space> after async keyword

2 Answers