├── package.json
├── index.js
└── README.md


/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "eslint-config-react-native-prettier",
 3 |   "version": "1.0.1",
 4 |   "main": "index.js",
 5 |   "license": "MIT",
 6 |   "peerDependencies": {
 7 |     "eslint": ">= 4"
 8 |   },
 9 |   "dependencies": {
10 |     "babel-eslint": "^7.2.3",
11 |     "eslint-config-prettier": "^2.2.0",
12 |     "eslint-plugin-babel": "^4.1.1",
13 |     "eslint-plugin-flowtype": "^2.34.1",
14 |     "eslint-plugin-import": "^2.6.0",
15 |     "eslint-plugin-prettier": "^2.1.2",
16 |     "eslint-plugin-react": "^7.1.0",
17 |     "prettier": "^1.5.2"
18 |   }
19 | }
20 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   "extends": [
 3 |     "plugin:flowtype/recommended",
 4 |     "plugin:react/recommended",
 5 |     "plugin:import/errors",
 6 |     "plugin:import/warnings",
 7 |     "prettier",
 8 |     "prettier/flowtype",
 9 |     "prettier/react"
10 |   ],
11 |   "plugins": [
12 |     "flowtype",
13 |     "react",
14 |     "prettier"
15 |   ],
16 |   "globals": {
17 |     "document": false
18 |   },
19 |   "parserOptions": {
20 |     "ecmaVersion": 2017,
21 |     "sourceType": "module",
22 |     "ecmaFeatures": {
23 |       "jsx": true,
24 |       "experimentalObjectRestSpread": true,
25 |       "experimentalDecorators": true
26 |     }
27 |   },
28 |   "env": {
29 |     "jest": true,
30 |     "node": true
31 |   },
32 |   "rules": {
33 |     "no-unused-vars": 1,
34 |     "no-duplicate-imports": 0,
35 |     "import/no-duplicates": 2,
36 |     "import/named": 0,
37 |     "import/no-unresolved": 0,
38 |     "react/prop-types": [1, { "skipUndeclared": true }],
39 |     "react/display-name": 0,
40 |     "prettier/prettier": ["error", {
41 |       "tabWidth": 2,
42 |       "printWidth": 80,
43 |       "singleQuote": true,
44 |       "jsxBracketSameLine": true,
45 |       "trailingComma": "es5"
46 |     }]
47 |   }
48 | };
49 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # eslint-config-react-native-prettier
 2 | 
 3 | Extends the following plugins and adds configuration that works well
 4 | with React Native:
 5 | 
 6 | ```
 7 | plugin:flowtype/recommended
 8 | plugin:react/recommended
 9 | plugin:import/errors
10 | plugin:import/warnings
11 | prettier
12 | prettier/flowtype
13 | prettier/react
14 | ```
15 | 
16 | ## Set it up
17 | 
18 | ### 1. Install the package (& ESLint)
19 | 
20 | ```
21 | npm i eslint-config-react-native-prettier --save-dev
22 | 
23 |  # or
24 | 
25 | yarn add -D eslint-config-react-native-prettier
26 | ```
27 | 
28 | If you don't have eslint installed on your project already, install that
29 | too:
30 | 
31 | ```
32 | npm i eslint --save-dev
33 | 
34 |  # or
35 | 
36 | yarn add -D eslint
37 | ```
38 | 
39 | ### 2. Configure your project to use it
40 | 
41 | Create `.eslintrc` in your project root, and put this in it:
42 | 
43 | ```json
44 | {
45 |   "extends": [
46 |     "react-native-prettier"
47 |   ]
48 | }
49 | ```
50 | 
51 | Feel free to customize further as you would in other ESLint configs.
52 | 
53 | ### 3. Add scripts
54 | 
55 | In `package.json`, you might want to add a couple of useful scripts:
56 | 
57 | ```json
58 | "scripts": {
59 |   "lint": "eslint .",
60 |   "prettier": "eslint . --fix"
61 | },
62 | ```
63 | 
64 | ### 4. Configure your editor
65 | 
66 | I use Visual Studio Code along with the [vscode-eslint extension from
67 | Microsoft](https://github.com/Microsoft/vscode-eslint). I personally
68 | prefer disabling autofix on save and instead setting up a keyboard
69 | shortcut for formatting.
70 | 


--------------------------------------------------------------------------------