Skip to content

Commit

Permalink
Merge pull request #20 from arcticicestudio/feature/gh-15-eslint
Browse files Browse the repository at this point in the history
Merge pull request #20 from arcticicestudio/feature/gh-15-eslint

Integrated ESLint (1), the pluggable and de-facto standard linting
utility for JavaScript.

>> Configuration Preset

The "eslint-config-arcticicestudio" configuration preset is used is
which the Arctic Ice Studio JavaScript Style (3). It it built on top of
eslint-config-arcticicestudio-base (4) and includes rules of the
following plugins:

- eslint-plugin-import (5)
- eslint-plugin-jsx-a11y (6)
- eslint-plugin-react (7)

Since the custom preset is still in major version `0` note that the
version range is `>=0.x.x <1.0.0` to avoid NPM's "SemVer Major Zero
Caveat". When defining package versions with the the carat `^` or tilde
`~` range selector it won't affect packages with a major version of `0`.
NPM will resolve these packages to their exact version until the major
version is greater or equal to `1`.
To avoid this caveat the more detailed version range `>=0.x.x <1.0.0` is
used to resolve all versions greater or equal to `0.x.x` but less than
`1.0.0`. This will always use the latest `0.x.x` version and removes the
need to increment the version manually on each new release.

To allow to lint all valid Babel code babel-eslint (8) will be included
and specified as main parser (9). Also to make use of the latest
experimental Babel features and proposals eslint-plugin-babel (10) has
been added:

- `babel/camelcase` with level `error` - doesn't complain about optional
  chaining (`let foo = bar?.a_b;`). The core rule `camelcase` (1) has
  been disabled.
- `babel/no-unused-expressions` with level `error` - doesn't fail when
  using `do` expressions or optional chaining (`a?.b()`). The core rule
  `no-unused-expressions` (12) has been disabled.

See the documentation of provided rules (13) and required configurations
to use them.

The `.eslintrc.js` configuration file has been placed in the project
root next to the `.eslintignore` file to define ignore pattern.
It specifies the environments (14) which define global variables that
are predefined:

- `browser` - browser global variables.
- `node` - Node.js global variables and Node.js scoping.

>>> Webpack preparations

To prepare for a better developer experience with Webpack (which will be
used later on through Gatsby) the resolvers of the
eslint-plugin-import (15) are configured for the `src` and
`src/components` paths.

>>>> Disabled rules

Due to compatibility problems and message noise the `no-confusing-arrow`
rule has been disabled. It can be re-enabled again when the used preset
handles the problem or disables the rule too.

Also to suppress errors in the future with Gatsby the
`import/no-extraneous-dependencies` has also been overridden (still
error `level`) by adding the `devDependencies` option and add the
exception for `./.gatsby/**/*.js`. This allows to use development
dependencies in Gatsby configuration files without linting errors since
these are necessary and some will be provided by Gatsby itself without
being explicitly added to the `package.json`.

>> NPM scripts/tasks

To allow to run the JavaScript linting separately a `lint:js` NPM
script/task has been added to be included in the main `lint` script flow
later on. To use the great auto-fixing (16) feature another `format:js`
script/task has been added too.

>> Initial Linting

Afterwards the current code base has been linted for first time to find
potential JavaScript style guide violations, but all sources were
compliant.

References:

  (1) https://eslint.org
  (2) https://github.com/arcticicestudio/eslint-config-arcticicestudio
  (3) https://arcticicestudio.github.io/styleguide-javascript
  (4) https://github.com/arcticicestudio/eslint-config-arcticicestudio-base
  (5) https://github.com/benmosher/eslint-plugin-import
  (6) https://github.com/evcohen/eslint-plugin-jsx-a11y
  (7) https://github.com/yannickcr/eslint-plugin-react
  (8) https://github.com/babel/babel-eslint
  (9) https://eslint.org/docs/user-guide/configuring#specifying-parser
  (10) https://github.com/babel/eslint-plugin-babel
  (11) https://eslint.org/docs/rules/camelcase
  (12) https://eslint.org/docs/rules/no-unused-expressions
  (13) https://github.com/babel/eslint-plugin-babel#rules
  (14) https://eslint.org/docs/user-guide/configuring#specifying-environments
  (15) https://github.com/benmosher/eslint-plugin-import#resolvers
  (16) https://eslint.org/docs/user-guide/command-line-interface#fixing-problems
  • Loading branch information
arcticicestudio authored Nov 17, 2018
2 parents 1d2959c + 2743f09 commit d4bd783
Show file tree
Hide file tree
Showing 4 changed files with 1,488 additions and 7 deletions.
17 changes: 17 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
# Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
# Copyright (C) 2018-present Sven Greb <[email protected]>
#
# Project: Nord Docs
# Repository: https://github.com/arcticicestudio/nord-docs
# License: MIT

.cache/*
build/*
content/*
**/node_modules/*
public/*
static/*
!.gatsby
!.eslintrc.js
!.huskyrc.js
!.remarkrc.js
51 changes: 51 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
/*
* Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
* Copyright (C) 2018-present Sven Greb <[email protected]>
*
* Project: Nord Docs
* Repository: https://github.com/arcticicestudio/nord-docs
* License: MIT
*/

/**
* @file The ESLint configuration.
* @author Arctic Ice Studio <[email protected]>
* @author Sven Greb <[email protected]>
* @see https://github.com/babel/eslint-plugin-babel#rules
* @see https://github.com/tc39/proposal-optional-chaining
*/

const { resolve } = require("path");

module.exports = {
extends: "arcticicestudio",
plugins: ["babel"],
parser: "babel-eslint",
env: {
browser: true,
node: true
},
settings: {
"import/resolver": {
node: {
/* Resolve Webpack alias imports */
paths: [resolve(__dirname, "src"), resolve(__dirname, "src/components")]
}
}
},
rules: {
"no-confusing-arrow": "off",
/* Suppress errors when importing development dependencies */
"import/no-extraneous-dependencies": ["error", { devDependencies: ["./.gatsby/**/*.js"] }],
/*
* Enable support for experimental features:
*
* - `babel/camelcase` - doesn't complain about optional chaining (`let foo = bar?.a_b;`).
* - `babel/no-unused-expressions` - doesn't fail when using `do` expressions or optional chaining (`a?.b()`).
*/
"babel/camelcase": "error",
camelcase: "off",
"babel/no-unused-expressions": "error",
"no-unused-expressions": "off"
}
};
Loading

0 comments on commit d4bd783

Please sign in to comment.