React Native error on double curly braces, ESLint/Prettier Warnings

Question

I'm new to React Native and try to walk through a basic tutorial on official website. but when I finish the configuration this error come out. it seems like something to do with Prettier issue but I couldn't figure out why. This is the code.

.prettierrc

module.exports = {
  bracketSpacing: true,
  jsxBracketSameLine: true,
  singleQuote: true,
  trailingComma: 'all',
  semi: true,
};

Answer 1

those are prettier and eslint error. For prettier issue maybe you can use format onsave on vscode, so whenever you save the file, it will format the file according to your prettierrc.

For eslint error usually because of your code is breaking the rules of your eslint config. For example on your screenshot above, there is error from react-native/no-inline-styles , refer to rules description is telling us to not put style inline. If you want this rule to be ignored, you can set on your eslint config file like

"rules": {
  "react-native/no-inline-styles": "off",
}

Answer 2

You will have to put the styling in quotes. You will have to see the error and fix them accordingly. All of them are related to styling for now.