ASP.NET Core 3 and React

Adding Prettier

We are going to add Prettier to our project by following these steps in Visual Studio Code:

1. Make sure you are in the frontend directory and execute the following command to install Prettier:

> npm install prettier --save-dev

2. Now, we want Prettier to take responsibility for the style rules of ESLint. Let's install some npm packages that will do this:

> npm install eslint-config-prettier eslint-plugin-prettier --save-dev

eslint-config-prettier disables ESLint rules that conflict with Prettier. Here, eslint-plugin-prettier is an ESLint rule that formats code using Prettier.

3. Now, let's tell ESLint to let Prettier take care of the code formatting by adding the following highlighted changes to .eslintrc.json:

{ "extends": ...