Replace `'react'` with `"react"` eslint(prettier/prettier)

Question

Local environment:

• IDE: vscode
• Language mode: JavasSript React

import React from 'react';

A syntax error message appears:

Replace `'react'` with `"react"`eslint(prettier/prettier)

How can I configure it?

---

in .eslintrc.js

module.exports = {
  root: true,
  extends: '@react-native-community',
  rules: {
    quotes: [1, 'single'],
  }
};

Thank you for your answer. Rules can be solved

But I want to know where @react-native-community comes from. I didn't see this file.

Solution 1

You can try something like this, it works for me.

package.json

  "devDependencies": {
    "eslint-plugin-prettier": "^3.1.1",
    "prettier": "^1.18.2"
  },

.eslintrc

{
  "extends": "react-app",
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error"
  }
}

.prettierrc

{
  "semi": false,
  "trailingComma": "all",
  "singleQuote": true,
  "printWidth": 80,
  "tabWidth": 3
}

Solution 2

Have a look at the documentation here. It specifies the singleQuote option, which could be configured in a configuration file for prettier or in the package.json, i.e.:

"prettier": {
    "singleQuote": true
}

For other options of configuration, have a look here.