From 84ff8f742ca9a17436bfce97cba9a27ce9983f03 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Mon, 19 Aug 2019 11:49:15 +0200
Subject: [PATCH] document prettier

---
 .eslintrc |  3 ++-
 README.md | 32 ++++++++++++++++++++++++++++++--
 2 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/.eslintrc b/.eslintrc
index 720ed2a..d331763 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -1,3 +1,4 @@
 {
-  "extends": ["./index.js", "prettier/standard", "plugin:prettier/recommended"]
+  "extends": ["./index.js", "prettier/standard", "plugin:prettier/recommended"],
+  "plugins": ["prettier"]
 }
diff --git a/README.md b/README.md
index 7ef8193..a52e52a 100644
--- a/README.md
+++ b/README.md
@@ -20,6 +20,7 @@ Don't be like that cat.
 
 - [Usage](#usage)
   - [React](#react)
+  - [Prettier](#prettier)
   - [Editor Plugins](#editor-plugins)
 - [Rules](#rules)
 - [Development](#development)
@@ -32,7 +33,7 @@ Don't be like that cat.
 
 ## Usage
 
-For every project containing JavaScript, ESLint should be set up with this config.
+For every project containing JavaScript, ESLint should be set up with this base setup.
 
 ```bash
 npm install --save-dev eslint eslint-config-oceanprotocol
@@ -51,7 +52,7 @@ Then, create a new file `.eslintrc` in the root of your project and fill with:
 When using within a React project use this to get set up:
 
 ```bash
-npm install --save-dev eslint eslint-config-oceanprotocol
+npm i -D eslint eslint-config-oceanprotocol
 ```
 
 And in your `.eslintrc`:
@@ -62,6 +63,33 @@ And in your `.eslintrc`:
 }
 ```
 
+### Prettier
+
+Additionally, you should add [Prettier](https://prettier.io) to your project and work with it through ESLint:
+
+```bash
+npm i -D prettier eslint-config-prettier eslint-plugin-prettier
+```
+
+Then add a `.prettierrc` file to the root of your project with this content:
+
+```json
+{
+    "semi": false,
+    "singleQuote": true,
+    "trailingComma": "none"
+}
+```
+
+Finally, modify your `.eslintrc`:
+
+```json
+{
+  "extends": ["oceanprotocol", "prettier/standard", "plugin:prettier/recommended"],
+  "plugins": ["prettier"]
+}
+```
+
 ### Editor Plugins
 
 For maximum fun during coding, install an ESLint plugin in your favorite editor to get suggestions and autofixes as you type.