Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

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.

like image 627
ebyte Avatar asked Nov 20 '19 08:11

ebyte


People also ask

Can prettier and ESLint work together?

Both configuration files for Prettier and ESLint can be adjusted to your needs. If you need to add rules, you can do it with both files. If you need to disable a rule coming from Airbnb's style guide, you can do it in the ESLint configuration.

How do you set prettier with ESLint in React project?

Open the terminal in your project root folder and install eslint as a dev dependency. We also need to enable the eslint and prettier extension for the VSCode. So visit the extensions section of VSCode (ctrl + shift + x) and search for Eslint and Prettier — Code formatter and install it.


1 Answers

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
}
like image 153
Olivier Lépine Avatar answered Sep 28 '22 02:09

Olivier Lépine