diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 000000000..4d9e3a006 --- /dev/null +++ b/.eslintignore @@ -0,0 +1,5 @@ +.next/ +dist/ +coverage/ +node_modules/ +package-lock.json \ No newline at end of file diff --git a/.eslintrc.json b/.eslintrc.json index 631d19023..ccc2d502d 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -7,26 +7,15 @@ }, "extends": [ "airbnb-base", - "prettier", "eslint:recommended", "plugin:react/recommended", "plugin:cypress/recommended", - "plugin:@next/next/recommended" - ], - "ignorePatterns": [ - "**/.next/**", - "**/public/**", - "**/dist/**", - "package-lock.json" + "plugin:@next/next/recommended", + "prettier" ], "parser": "@babel/eslint-parser", - "plugins": [ - "react", - "prettier", - "simple-import-sort", - "import", - "eslint-plugin-import" - ], + "plugins": ["react", "simple-import-sort", "import", "eslint-plugin-import"], + "reportUnusedDisableDirectives": true, "rules": { "array-callback-return": "warn", "block-scoped-var": "warn", @@ -111,7 +100,6 @@ "prefer-const": "warn", "prefer-destructuring": "warn", "prefer-template": "warn", - "prettier/prettier": "error", "radix": "off", "react/display-name": "warn", "react/jsx-uses-vars": "warn", @@ -132,7 +120,7 @@ "settings": { "react": { "pragma": "React", - "version": "17.0.2" + "version": "^16.13.1" } } } diff --git a/.lintstagedrc.js b/.lintstagedrc.js new file mode 100644 index 000000000..e43f27955 --- /dev/null +++ b/.lintstagedrc.js @@ -0,0 +1,4 @@ +module.exports = { + '*.{js,jsx,ts,tsx,html,css}': ['prettier --write', 'eslint --fix'], + '*.{md,json,yml,yaml}': ['prettier --write'], +}; diff --git a/.prettierignore b/.prettierignore index 284860161..9e68279f0 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,4 +1,5 @@ **/.next/** **/dist/** package-lock.json -coverage \ No newline at end of file +coverage +node_modules \ No newline at end of file diff --git a/README.md b/README.md index b5d46c096..eb9289862 100644 --- a/README.md +++ b/README.md @@ -1,34 +1,35 @@ **Table of Contents** - [Treetracker Web Map Site](#treetracker-web-map-site) - - [Project Description](#project-description) - - [Development Environment Quick Start](#development-environment-quick-start) - - [Workflow with Github](#workflow-with-github) - - [Test Driven Development](#test-driven-development) - - [Glossary](#glossary) - - [Test File Naming Conventions](#test-file-naming-conventions) - - [How to Build Components](#how-to-build-components) - - [Adding Material UI Theme to Component Tests](#adding-material-ui-theme-to-component-tests) - - [Using Correct Link Component](#using-correct-link-component) - - [Mocking NextJs Router in Component Tests](#mocking-nextjs-router-in-component-tests) - - [Mocking Static Images](#mocking-static-images) - - [How to Build Pages/Routes](#how-to-build-pagesroutes) - - [Integration Tests](#integration-tests) - - [How to mock the API](#how-to-mock-the-api) - - [Mocking API calls in NextJs SSR functions](#mocking-api-calls-in-nextjs-ssr-functions) - - [The API](#the-api) - - [The current map API](#the-current-map-api) - - [The in-progress API](#the-in-progress-api) - - [Using our mock API server](#using-our-mock-api-server) - - [Config](#config) - - [The route/URL spec](#the-routeurl-spec) - - [UI design resource](#ui-design-resource) - - [Code style guide](#code-style-guide) - - [Prettier](#prettier) - - [Eslint](#eslint) - - [husky](#husky) - - [Commit Message and PR Title Format](#commit-message-and-pr-title-format) - - [Other resource from Greenstand](#other-resource-from-greenstand) + - [Project Description](#project-description) + - [Development Environment Quick Start](#development-environment-quick-start) + - [Workflow with Github](#workflow-with-github) + - [Test Driven Development](#test-driven-development) + - [Glossary](#glossary) + - [Test File Naming Conventions](#test-file-naming-conventions) + - [How to Build Components](#how-to-build-components) + - [Adding Material UI Theme to Component Tests](#adding-material-ui-theme-to-component-tests) + - [Using Correct Link Component](#using-correct-link-component) + - [Mocking NextJs Router in Component Tests](#mocking-nextjs-router-in-component-tests) + - [Mocking Static Images](#mocking-static-images) + - [How to Build Pages/Routes](#how-to-build-pagesroutes) + - [Integration Tests](#integration-tests) + - [How to mock the API](#how-to-mock-the-api) + - [Mocking API calls in NextJs SSR functions](#mocking-api-calls-in-nextjs-ssr-functions) + - [The API](#the-api) + - [The current map API](#the-current-map-api) + - [The in-progress API](#the-in-progress-api) + - [Using our mock API server](#using-our-mock-api-server) + - [Config](#config) + - [The route/URL spec](#the-routeurl-spec) + - [UI design resource](#ui-design-resource) + - [Code style guide](#code-style-guide) + - [Prettier](#prettier) + - [Eslint](#eslint) + - [husky](#husky) + - [Lint-Staged](#lint-staged) + - [Commit Message and PR Title Format](#commit-message-and-pr-title-format) + - [Other resource from Greenstand](#other-resource-from-greenstand) # Treetracker Web Map Site @@ -318,20 +319,11 @@ You can find the Eslint rules in the .eslintrc.js file. ### husky -With husky we can use any git hook. Git Hooks are actions that can be executed if a certain Git event occurs. For example when a developer makes a 'git commit' or a 'git push'. -To add a command to a pre-commit hook or create a new one, use: +With husky we can use any git hook. Git Hooks are actions that can be executed if a certain Git event occurs. For example when a developer makes a 'git commit' or a 'git push'. Pre-commit hooks are listed in `.husky/pre-commit` -``` -npx husky add .husky/pre-commit "" -``` - -.husky folder contains all our hooks. E.g.: - -``` -npx pretty-quick --staged -``` +### Lint-Staged -The [pretty-quick](https://www.npmjs.com/package/pretty-quick) npm package runs Prettier on your changed files. +[Lint-staged](https://github.com/okonet/lint-staged) is used with husky to run actions exclusively on staged files. This allows us to lint staged files and automatically add fixes to the commit. ### Commit Message and PR Title Format diff --git a/package.json b/package.json index 97d21e908..f3d1097b0 100644 --- a/package.json +++ b/package.json @@ -95,10 +95,5 @@ "webpack": "^5.58.2", "webpack-dev-server": "^3.11.2" }, - "proxy": "http://127.0.0.1:3001", - "lint-staged": { - "*.js": [ - "eslint --cache --fix" - ] - } + "proxy": "http://127.0.0.1:3001" }