markmctamney / eslint-config-2

Personal setup for ESLint, Prettier, TypeScript, etc. for universal apps with React Native, Expo, and NextJS

eslint-config-markmctamney

Personal setup for ESLint, Prettier, and TypeScript

Overview

File Types / Extensions:

• TypeScript (.tsx, .ts)
• JavaScript (.js)
• JSON (.json, .jsonc, .json5)
• YAML (.yaml, .yml)
• GraphQL (.graphql, gql)

Target Frameworks:

• React Native / Expo
• React / NextJS

Installation

yarn add -D eslint-config-markmctamney@https://github.com/markmctamney/eslint-config

You will also need to install eslint, prettier, @typescript-eslint/eslint-plugin, and @typescript-eslint/parser:

yarn add -D eslint prettier @typescript-eslint/eslint-plugin @typescript-eslint/parser

Usage

Import this config into your own ESLint configuration using the extends option. ESLint checks both package.json and .eslintrc.* files for its configuration:

package.json

{
  "eslintConfig": {
    "extends": "markmctamney"
  }
}

.eslintrc.js

module.exports = {
  extends: 'markmctamney',
};

Customizing Prettier

If you would like to customize the Prettier settings, create a file named .prettierrc in your project directory. An example of Prettier configuration file:

{
  "printWidth": 100,
  "tabWidth": 2,
  "singleQuote": true,
  "jsxBracketSameLine": true,
  "trailingComma": "es5"
}

Read more about configuring prettier and all of the available options.