From 83fe205dcf2e3a3e1bd088a7eb7bcb60243925d8 Mon Sep 17 00:00:00 2001 From: Joseph Junker Date: Wed, 19 Jul 2017 13:56:19 -0700 Subject: [PATCH 1/3] adds react-flow package --- README.md | 4 +- package.json | 14 +++-- .../.eslintrc | 3 + .../README.md | 55 +++++++++++++++++++ .../bin/eslint-godaddy-react-flow | 4 ++ .../extends.js | 17 ++++++ .../eslint-config-godaddy-react-flow/index.js | 39 +++++++++++++ .../package.json | 52 ++++++++++++++++++ 8 files changed, 183 insertions(+), 5 deletions(-) create mode 100644 packages/eslint-config-godaddy-react-flow/.eslintrc create mode 100644 packages/eslint-config-godaddy-react-flow/README.md create mode 100755 packages/eslint-config-godaddy-react-flow/bin/eslint-godaddy-react-flow create mode 100644 packages/eslint-config-godaddy-react-flow/extends.js create mode 100644 packages/eslint-config-godaddy-react-flow/index.js create mode 100644 packages/eslint-config-godaddy-react-flow/package.json diff --git a/README.md b/README.md index 6eea9bad..c95f5b24 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,8 @@ Official GoDaddy JavaScript styleguide. It includes `eslint` packages for three - [`eslint-config-godaddy`]: Base configuration for _non-React_, ES6 JavaScript applications - [`eslint-config-godaddy-react`]: Configuration for ES6 React JavaScript applications -- [`eslint-config-godaddy-es5`]: Configuration for React _and_ non-React ES5 JavaScript applications. +- [`eslint-config-godaddy-es5`]: Configuration for React _and_ non-React ES5 JavaScript applications +- [`eslint-config-godaddy-react-flow`]: Configuration for ES6 React JavaScript applications using Flow There are many useful features: @@ -138,3 +139,4 @@ No problem. Reach out to us by [opening an issue] [`eslint-config-godaddy`]: /packages/eslint-config-godaddy [`eslint-config-godaddy-react`]: /packages/eslint-config-godaddy-react [`eslint-config-godaddy-es5`]: /packages/eslint-config-godaddy-es5 +[`eslint-config-godaddy-react-flow`]: /packages/eslint-config-godaddy-react-flow diff --git a/package.json b/package.json index bdc41fc2..81fcbd4f 100644 --- a/package.json +++ b/package.json @@ -4,14 +4,16 @@ "description": "The approach to JavaScript at GoDaddy. We think it's pretty decent.", "scripts": { "lint": "eslint -c .eslintrc.js packages/**/*.js", - "postinstall": "run-p install:config install:config:es5 install:config:react", + "postinstall": "run-p install:config install:config:es5 install:config:react install:config:react-flow", "install:config": "cd packages/eslint-config-godaddy && npm install", "install:config:es5": "cd packages/eslint-config-godaddy-es5 && npm install", "install:config:react": "cd packages/eslint-config-godaddy-react && npm install", - "test": "run-p lint test:config test:config:es5 test:config:react", + "install:config:react-flow": "cd packages/eslint-config-godaddy-react-flow && npm install", + "test": "run-p lint test:config test:config:es5 test:config:react test:config:react-flow", "test:config": "cd packages/eslint-config-godaddy && npm test", "test:config:es5": "cd packages/eslint-config-godaddy-es5 && npm test", - "test:config:react": "cd packages/eslint-config-godaddy-react && npm test" + "test:config:react": "cd packages/eslint-config-godaddy-react && npm test", + "test:config:react-flow": "cd packages/eslint-config-godaddy-react-flow && npm test" }, "repository": { "type": "git", @@ -27,7 +29,8 @@ "es6", "es2015", "react", - "jsx" + "jsx", + "flow" ], "license": "MIT", "author": "GoDaddy.com Operating Company, LLC", @@ -41,7 +44,10 @@ "godaddy-js-style-eslint": "./bin/eslint" }, "devDependencies": { + "babel-eslint": "^7.2.1", "eslint": "^3.15.0", + "eslint-plugin-babel": "^4.0.1", + "eslint-plugin-flowtype": "^2.30.4", "eslint-find-rules": "^1.14.3", "eslint-plugin-json": "^1.2.0", "eslint-plugin-mocha": "^4.8.0", diff --git a/packages/eslint-config-godaddy-react-flow/.eslintrc b/packages/eslint-config-godaddy-react-flow/.eslintrc new file mode 100644 index 00000000..d811f404 --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/.eslintrc @@ -0,0 +1,3 @@ +{ + "extends": "./index.js" +} diff --git a/packages/eslint-config-godaddy-react-flow/README.md b/packages/eslint-config-godaddy-react-flow/README.md new file mode 100644 index 00000000..8a86f777 --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/README.md @@ -0,0 +1,55 @@ +# eslint-config-godaddy-react-flow + +Configuration for ES6 React JavaScript applications using Flow, officially used at GoDaddy. There are many useful features: + +- **Standard. No configuration.** – Stop worrying about style and focus on your work. +- **Modern** – Uses modern linting tools like `eslint`. +- **Auto-fix** – Auto-fix is enabled by-default through in `eslint`. Many rules will fix themselves! + +This styleguide is used by dozens of product teams at GoDaddy. Have a question or comment? [Open an issue!](https://github.com/godaddy/javascript/issues/new) + +## Installation + +``` sh +# ES6 (including React rules) +npm i eslint-config-godaddy-react-flow --save-dev +``` + +## Usage + +There are two ways to use this styleguide depending on your own tooling preference: directly using pre-included binaries or running `eslint` yourself with a custom `.eslintrc` config. + +##### 1. Use the pre-included binaries. + +These use _exactly_ the configuration defined in this package (`eslint-config-godaddy-react-flow`) **with auto-fix enabled automatically.** + +``` js +{ + "scripts": { + "lint": eslint-godaddy-react-flow files/ you/ want-to/ lint/" + } +} +``` + +##### 2. Define your local `.eslintrc` and run `eslint` yourself: + +``` js +module.exports = { + extends: 'godaddy-react-flow', + rules: { + // + // Put any rules you wish to override here. + // + } +} +``` + +The `--fix` option in `eslint` is [**only** available as a CLI option](https://github.com/eslint/eslint/issues/8041). Auto-fix will *NOT be enabled* unless you run `eslint --fix` in your `package.json`. + +``` js +{ + "scripts": { + "lint": "eslint --fix files/ you/ want-to/ lint/" + } +} +``` diff --git a/packages/eslint-config-godaddy-react-flow/bin/eslint-godaddy-react-flow b/packages/eslint-config-godaddy-react-flow/bin/eslint-godaddy-react-flow new file mode 100755 index 00000000..4a887526 --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/bin/eslint-godaddy-react-flow @@ -0,0 +1,4 @@ +#!/usr/bin/env node +require('eslint-config-godaddy/cli')( + require('path').join(__dirname, '..', 'index') +); diff --git a/packages/eslint-config-godaddy-react-flow/extends.js b/packages/eslint-config-godaddy-react-flow/extends.js new file mode 100644 index 00000000..d24cbcba --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/extends.js @@ -0,0 +1,17 @@ +const path = require('path'); + +/** + * Helper function that attempts to resolve the specify named `config` + * locally before attempting to resolve it from `node_modules`. This + * tricks TravisCI into resolving correctly. + * + * @param {string} config Named `eslint-config-*` module + * @returns {string} Full path resolved locally or from `node_modules`. + */ +module.exports = function resolveLocal(config) { + try { + return require.resolve(path.resolve(__dirname, '..', config)); + } catch (ex) { + return require.resolve(config); + } +}; diff --git a/packages/eslint-config-godaddy-react-flow/index.js b/packages/eslint-config-godaddy-react-flow/index.js new file mode 100644 index 00000000..50071d41 --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/index.js @@ -0,0 +1,39 @@ +module.exports = { + extends: [ + require('./extends')('eslint-config-godaddy'), + 'plugin:eslint-plugin-react/recommended' + ], + plugins: ['react', 'flowtype', 'babel'], + parser: 'babel-eslint', + parserOptions: { + ecmaFeatures: { + jsx: true, + experimentalObjectRestSpread: true + } + }, + rules: { + 'react/display-name': 0, + 'react/jsx-pascal-case': 2, + 'react/jsx-uses-react': 1, + 'react/prefer-es6-class': 2, + // + // Whitespace rules for specific scenarios (e.g. JSX) + // + 'react/jsx-curly-spacing': [2, 'always', { + spacing: { objectLiterals: 'never' } + }], + 'jsx-quotes': [2, 'prefer-single'], + // + // Flow rules + // + 'flowtype/define-flow-type': 2, + 'flowtype/space-after-type-colon': [2, 'always'], + 'flowtype/type-id-match': [2, '^([A-Z][A-Za-z0-9]*)$'], + 'flowtype/use-flow-type': 2 + }, + settings: { + flowtype: { + onlyFilesWithFlowAnnotation: true + } + } +}; diff --git a/packages/eslint-config-godaddy-react-flow/package.json b/packages/eslint-config-godaddy-react-flow/package.json new file mode 100644 index 00000000..84b50997 --- /dev/null +++ b/packages/eslint-config-godaddy-react-flow/package.json @@ -0,0 +1,52 @@ +{ + "name": "eslint-config-godaddy-react-flow", + "version": "1.1.0", + "description": "ESLint config for consistent style in ES6 React projects using Flow at GoDaddy.", + "scripts": { + "lint": "eslint .", + "pretest": "npm run --silent lint", + "test": "echo ok", + "unused": "eslint-find-rules --unused ./index.js || echo ''" + }, + "repository": { + "type": "git", + "url": "git@github.com:godaddy/javascript.git" + }, + "keywords": [ + "godaddy", + "javascript", + "styleguide", + "style-guide", + "eslint", + "es6", + "react", + "flow" + ], + "bin": { + "eslint-godaddy-react-flow": "bin/eslint-godaddy-react-flow" + }, + "dependencies": { + "eslint-config-godaddy": "^1.0.0" + }, + "peerDependencies": { + "eslint": "^3.15.0", + "babel-eslint": "^7.2.1", + "eslint-find-rules": "^1.14.3", + "eslint-plugin-babel": "^4.0.1", + "eslint-plugin-flowtype": "^2.30.4", + "eslint-plugin-json": "^1.2.0", + "eslint-plugin-mocha": "^4.8.0", + "eslint-plugin-react": "^6.9.0" + }, + "license": "MIT", + "devDependencies": { + "eslint": "^3.15.0", + "babel-eslint": "^7.2.1", + "eslint-find-rules": "^1.14.3", + "eslint-plugin-babel": "^4.0.1", + "eslint-plugin-flowtype": "^2.30.4", + "eslint-plugin-json": "^1.2.0", + "eslint-plugin-mocha": "^4.8.0", + "eslint-plugin-react": "^6.9.0" + } +} From fb356baf4d754bafb419715550a4c8a9bcb72087 Mon Sep 17 00:00:00 2001 From: Joseph Junker Date: Wed, 19 Jul 2017 14:30:56 -0700 Subject: [PATCH 2/3] fixes README typos --- packages/eslint-config-godaddy-react-flow/README.md | 2 +- packages/eslint-config-godaddy-react/README.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/eslint-config-godaddy-react-flow/README.md b/packages/eslint-config-godaddy-react-flow/README.md index 8a86f777..63f3443f 100644 --- a/packages/eslint-config-godaddy-react-flow/README.md +++ b/packages/eslint-config-godaddy-react-flow/README.md @@ -26,7 +26,7 @@ These use _exactly_ the configuration defined in this package (`eslint-config-g ``` js { "scripts": { - "lint": eslint-godaddy-react-flow files/ you/ want-to/ lint/" + "lint": "eslint-godaddy-react-flow files/ you/ want-to/ lint/" } } ``` diff --git a/packages/eslint-config-godaddy-react/README.md b/packages/eslint-config-godaddy-react/README.md index c0c45665..f9e14ca1 100644 --- a/packages/eslint-config-godaddy-react/README.md +++ b/packages/eslint-config-godaddy-react/README.md @@ -26,7 +26,7 @@ These use _exactly_ the configuration defined in this package (`eslint-config-g ``` js { "scripts": { - "lint": eslint-godaddy-react files/ you/ want-to/ lint/" + "lint": "eslint-godaddy-react files/ you/ want-to/ lint/" } } ``` From 0fb78f9bb7827891a4c81e16d37e3f6c48d59b86 Mon Sep 17 00:00:00 2001 From: Joseph Junker Date: Mon, 24 Jul 2017 10:31:53 -0700 Subject: [PATCH 3/3] makes flow config inherit react config --- .../eslint-config-godaddy-react-flow/index.js | 16 +--------------- .../package.json | 2 +- 2 files changed, 2 insertions(+), 16 deletions(-) diff --git a/packages/eslint-config-godaddy-react-flow/index.js b/packages/eslint-config-godaddy-react-flow/index.js index 50071d41..48390604 100644 --- a/packages/eslint-config-godaddy-react-flow/index.js +++ b/packages/eslint-config-godaddy-react-flow/index.js @@ -1,6 +1,6 @@ module.exports = { extends: [ - require('./extends')('eslint-config-godaddy'), + require('./extends')('eslint-config-godaddy-react'), 'plugin:eslint-plugin-react/recommended' ], plugins: ['react', 'flowtype', 'babel'], @@ -12,20 +12,6 @@ module.exports = { } }, rules: { - 'react/display-name': 0, - 'react/jsx-pascal-case': 2, - 'react/jsx-uses-react': 1, - 'react/prefer-es6-class': 2, - // - // Whitespace rules for specific scenarios (e.g. JSX) - // - 'react/jsx-curly-spacing': [2, 'always', { - spacing: { objectLiterals: 'never' } - }], - 'jsx-quotes': [2, 'prefer-single'], - // - // Flow rules - // 'flowtype/define-flow-type': 2, 'flowtype/space-after-type-colon': [2, 'always'], 'flowtype/type-id-match': [2, '^([A-Z][A-Za-z0-9]*)$'], diff --git a/packages/eslint-config-godaddy-react-flow/package.json b/packages/eslint-config-godaddy-react-flow/package.json index 84b50997..20811d4b 100644 --- a/packages/eslint-config-godaddy-react-flow/package.json +++ b/packages/eslint-config-godaddy-react-flow/package.json @@ -26,7 +26,7 @@ "eslint-godaddy-react-flow": "bin/eslint-godaddy-react-flow" }, "dependencies": { - "eslint-config-godaddy": "^1.0.0" + "eslint-config-godaddy-react": "^1.1.0" }, "peerDependencies": { "eslint": "^3.15.0",