Fresh RN projects fails ESLint / Prettier by default

[JonnyBurger]

React Native version:
0.60.0

Steps To Reproduce

1. Create new project react-native init rn60stable && cd rn60stable
2. Run npm run lint

Describe what you expected to happen:

• No errors

Snack, code example, or link to a repository:

• Output:

/Users/jonnyburger/rn60stable/App.js
   9:16  error  Replace `Fragment}·from·'react'` with `·Fragment·}·from·"react"`                              prettier/prettier
  16:12  error  Delete `,`                                                                                    prettier/prettier
  17:8   error  Replace `'react-native'` with `"react-native"`                                                prettier/prettier
  24:21  error  Delete `,`                                                                                    prettier/prettier
  25:8   error  Replace `'react-native/Libraries/NewAppScreen'` with `"react-native/Libraries/NewAppScreen"`  prettier/prettier
  34:36  error  Insert `⏎········`                                                                            prettier/prettier
  72:36  error  Delete `,`                                                                                    prettier/prettier
  75:34  error  Delete `,`                                                                                    prettier/prettier
  79:26  error  Delete `,`                                                                                    prettier/prettier
  83:17  error  Replace `'600'` with `"600"`                                                                  prettier/prettier
  84:24  error  Delete `,`                                                                                    prettier/prettier
  89:17  error  Replace `'400'` with `"400"`                                                                  prettier/prettier
  90:23  error  Delete `,`                                                                                    prettier/prettier
  93:17  error  Replace `'700',` with `"700"`                                                                 prettier/prettier
  94:4   error  Delete `,`                                                                                    prettier/prettier

/Users/jonnyburger/rn60stable/__tests__/App-test.js
   5:8   error  Replace `'react-native'` with `"react-native"`                prettier/prettier
   6:19  error  Replace `'react'` with `"react"`                              prettier/prettier
   7:17  error  Replace `'../App'` with `"../App"`                            prettier/prettier
  10:22  error  Replace `'react-test-renderer'` with `"react-test-renderer"`  prettier/prettier
  12:4   error  Replace `'renders·correctly'` with `"renders·correctly"`      prettier/prettier

/Users/jonnyburger/rn60stable/babel.config.js
  2:13  error  Replace `'module:metro-react-native-babel-preset'],` with `"module:metro-react-native-babel-preset"]`  prettier/prettier

/Users/jonnyburger/rn60stable/index.js
  5:9   error  Replace `AppRegistry}·from·'react-native'` with `·AppRegistry·}·from·"react-native"`      prettier/prettier
  6:17  error  Replace `'./App'` with `"./App"`                                                          prettier/prettier
  7:9   error  Replace `name·as·appName}·from·'./app.json'` with `·name·as·appName·}·from·"./app.json"`  prettier/prettier

/Users/jonnyburger/rn60stable/metro.config.js
  13:30  error  Delete `,`  prettier/prettier
  14:8   error  Delete `,`  prettier/prettier
  15:7   error  Delete `,`  prettier/prettier
  16:4   error  Delete `,`  prettier/prettier

Maybe there should be a prettier config? Or no prettier integration at all?
However, that there can be lint errors in a fresh projects does not seem right.

[glaydsoncosta]

Same error over here. Fresh project came up with all these errors.

[keshav00001]

Please help , create new app , I am getting

[keshav00001]

React Native version:
0.60.0

Steps To Reproduce

1. Create new project react-native init rn60stable && cd rn60stable
2. Run npm run lint

Describe what you expected to happen:

• No errors

Snack, code example, or link to a repository:

• Output:

/Users/jonnyburger/rn60stable/App.js
   9:16  error  Replace `Fragment}·from·'react'` with `·Fragment·}·from·"react"`                              prettier/prettier
  16:12  error  Delete `,`                                                                                    prettier/prettier
  17:8   error  Replace `'react-native'` with `"react-native"`                                                prettier/prettier
  24:21  error  Delete `,`                                                                                    prettier/prettier
  25:8   error  Replace `'react-native/Libraries/NewAppScreen'` with `"react-native/Libraries/NewAppScreen"`  prettier/prettier
  34:36  error  Insert `⏎········`                                                                            prettier/prettier
  72:36  error  Delete `,`                                                                                    prettier/prettier
  75:34  error  Delete `,`                                                                                    prettier/prettier
  79:26  error  Delete `,`                                                                                    prettier/prettier
  83:17  error  Replace `'600'` with `"600"`                                                                  prettier/prettier
  84:24  error  Delete `,`                                                                                    prettier/prettier
  89:17  error  Replace `'400'` with `"400"`                                                                  prettier/prettier
  90:23  error  Delete `,`                                                                                    prettier/prettier
  93:17  error  Replace `'700',` with `"700"`                                                                 prettier/prettier
  94:4   error  Delete `,`                                                                                    prettier/prettier

/Users/jonnyburger/rn60stable/__tests__/App-test.js
   5:8   error  Replace `'react-native'` with `"react-native"`                prettier/prettier
   6:19  error  Replace `'react'` with `"react"`                              prettier/prettier
   7:17  error  Replace `'../App'` with `"../App"`                            prettier/prettier
  10:22  error  Replace `'react-test-renderer'` with `"react-test-renderer"`  prettier/prettier
  12:4   error  Replace `'renders·correctly'` with `"renders·correctly"`      prettier/prettier

/Users/jonnyburger/rn60stable/babel.config.js
  2:13  error  Replace `'module:metro-react-native-babel-preset'],` with `"module:metro-react-native-babel-preset"]`  prettier/prettier

/Users/jonnyburger/rn60stable/index.js
  5:9   error  Replace `AppRegistry}·from·'react-native'` with `·AppRegistry·}·from·"react-native"`      prettier/prettier
  6:17  error  Replace `'./App'` with `"./App"`                                                          prettier/prettier
  7:9   error  Replace `name·as·appName}·from·'./app.json'` with `·name·as·appName·}·from·"./app.json"`  prettier/prettier

/Users/jonnyburger/rn60stable/metro.config.js
  13:30  error  Delete `,`  prettier/prettier
  14:8   error  Delete `,`  prettier/prettier
  15:7   error  Delete `,`  prettier/prettier
  16:4   error  Delete `,`  prettier/prettier

Maybe there should be a prettier config? Or no prettier integration at all?
However, that there can be lint errors in a fresh projects does not seem right.

How did You solve this problem?

[glaydsoncosta]

Reading another thread I figured out that another people are facing the same issue, and the problem is related with the RN 0.60 templates.

In this case I solved the problem creating a custom “eslintrc.js” with the correct rules.

Hope RN core team solve the problem asap.

[0xinhua]

How to solve this problem? I use the RN 0.60, the same problem by using npm run lint. any suggestion ?

[AlbertVilaCalvo]

@M1sery see this solution: #25840 (comment)

[0xinhua]

@AlbertVilaCalvo Thanks

[regalstreak]

Disable prettier this way in your .eslint.js

module.exports = {
  // ...
  extends: '@react-native-community',
  rules: {
    'prettier/prettier': 0,
  },
  // ...
};

[JonnyBurger]

Looks like it’s fixed in 0.60.5!
Thanks a lot!