Move ESLint Prettier support into base package (#38)

Before eslint-plugin-prettier [1] and its corresponding
eslint-config-prettier [2] package were supported by the
@arcticicestudio/eslint-config [3] rule preset package. This worked fine
for most projects, but also pulled in React specific dependencies like
eslint-plugin-react [4] and eslint-plugin-jsx-a11y [5].
To allow to use Prettier without `@arcticicestudio/eslint-config`,
the support has been moved into the @arcticicestudio/eslint-config-base
package, including the optional entry point.

[1]: https://github.com/prettier/eslint-plugin-prettier
[2]: https://github.com/prettier/eslint-config-prettier
[3]: https://github.com/arcticicestudio/styleguide-javascript/tree/develop/packages/%40arcticicestudio/eslint-config
[4]: https://github.com/yannickcr/eslint-plugin-react
[5]: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y

Co-authored-by: Sven Greb <[email protected]>

Closes GH-37

packages/@arcticicestudio/eslint-config-base/README.md

@@ -10,7 +10,7 @@
 
 <p align="center"><a href="https://github.com/arcticicestudio/styleguide-javascript/actions" target="_blank" rel="noreferrer"><img src="https://img.shields.io/github/workflow/status/arcticicestudio/styleguide-javascript/ci?style=flat-square&label=CI&logoColor=eceff4&colorA=4c566a&logo=github-actions"/></a></p>
 
-This package implements the base rules of the [Arctic Ice Studio JavaScript style guide][gh-stg-repo] as an extensible [ESLint][] configuration.
+This package implements the base rules of the [Arctic Ice Studio JavaScript style guide][gh-stg-repo] as an extensible [ESLint][] configuration with plugin support for [Prettier][].
 
 ## Getting Started
 
@@ -35,8 +35,8 @@ See the [Node distribution index][node-dist-index] for more information about wh
 
 #### Peer Dependencies
 
-Next to all base ESLint rules, the default export also contains rules related to ECMAScript 6+ including the [import][mdn-js-import] and [export][mdn-js-export] features.
-Therefore this package depends on the [`eslint-plugin-import`][gh-esl-p-import] and [`eslint`][gh-eslint] package that are defined as [peer dependencies][node-blog-peer_deps].
+Next to all base ESLint rules, the default export also contains rules related to ECMAScript 6+ including the [import][mdn-js-import] and [export][mdn-js-export] features as well as compatibility integrations for other projects like [Prettier][].
+Therefore this package depends on the [`eslint-plugin-import`][gh-esl-p-import], [eslint-plugin-prettier][gh-esl-p-prettier], [prettier][gh-prettier] and [`eslint`][gh-eslint] packages that are defined as [peer dependencies][node-blog-peer_deps].
 
 ##### npm versions `>=7.0.0`
 
@@ -90,14 +90,30 @@ yarn run install-peerdeps --dev @arcticicestudio/eslint-config-base
 
 ### Usage
 
-This package provides a [shareable configuration preset][esl-docs-conf_share] that can be used by [extending the ESLint configuration file][esl-docs-config#ext_conf]. Add `@arcticicestudio/eslint-config-base` to your `extends` array in your `.eslintrc` configuration file:
+This package provides a [shareable configuration preset][esl-docs-conf_share] that can be used by [extending the ESLint configuration file][esl-docs-config#ext_conf]. Add `@arcticicestudio/eslint-config-base` and/or any of the [additional entry points](#entry-points) to the `extends` array in your `.eslintrc` configuration file:
 
 ```js
 module.exports = {
-  extends: ["@arcticicestudio/eslint-config-base"],
+  extends: [
+    /* Provides support for all ESLint core rules. */
+    "@arcticicestudio/eslint-config-base",
+    /*
+     * Optional entry point to enable support for projects using Prettier.
+     * Note that this must always be placed after the `@arcticicestudio/eslint-config-base` preset to take precedence,
+     * otherwise it won't prevent errors due to useless and possibly conflicting rules!
+     */
+    "@arcticicestudio/eslint-config-base/prettier",
+  ],
 };
 ```
 
+## Entry Points
+
+This package provides multiple entry points that can be composed especially for the projects they are used in:
+
+- `@arcticicestudio/eslint-config-base` — The default entry point that support for all ESLint core rules.
+- `@arcticicestudio/eslint-config-base/prettier` — Entry point to enable support for [Prettier][] through [eslint-plugin-prettier][gh-esl-p-prettier] and the officially recommended Prettier ESLint configuration [eslint-config-prettier][gh-esl-c-prettier]. It disables possibly conflicting rules and rules that definitely not needed when using Prettier for code formatting. There is also additional support when Prettier is used for React based projects by extending the special `prettier/react` configuration that also disables specific `react/` and JSX rules. See the [@arcticicestudio/eslint-config][gh-t-pkg-esl] package to use React specific rules. Note that this configuration **should always be placed after `@arcticicestudio/eslint-config-base`** in order to override conflicting rules, otherwise the `@arcticicestudio/eslint-config-base` preset will take precedence leaving conflicting rules untouched!
+
 ## Contributing
 
 Please read the [contribution guidelines][gh-stg-b-readme#contrib] of the [Arctic Ice Studio JavaScript style guide][gh-stg-repo] project for detailed information.
@@ -112,11 +128,14 @@ Please read the [contribution guidelines][gh-stg-b-readme#contrib] of the [Arcti
 [esl-docs-config#ext_conf]: https://eslint.org/docs/user-guide/configuring#extending-configuration-files
 [eslint]: https://eslint.org
 [gh-blog-npm_v7]: https://github.blog/2020-10-13-presenting-v7-0-0-of-the-npm-cli
+[gh-esl-c-prettier]: https://github.com/prettier/eslint-config-prettier
 [gh-esl-p-import]: https://github.com/benmosher/eslint-plugin-import
 [gh-esl-p-jsx-a11y]: https://github.com/evcohen/eslint-plugin-jsx-a11y
+[gh-esl-p-prettier]: https://github.com/prettier/eslint-plugin-prettier
 [gh-esl-p-react]: https://github.com/yannickcr/eslint-plugin-react
 [gh-eslint]: https://github.com/eslint/eslint
 [gh-npm/rfcs-blob-install_peer_deps]: https://github.com/npm/rfcs/blob/latest/implemented/0025-install-peer-deps.md
+[gh-prettier]: https://github.com/prettier/prettier
 [gh-remarkjs/remark-lint]: https://github.com/remarkjs/remark-lint
 [gh-stg-b-readme#contrib]: https://github.com/arcticicestudio/styleguide-javascript#contributing
 [gh-stg-repo]: https://github.com/arcticicestudio/styleguide-javascript

packages/@arcticicestudio/eslint-config-base/package.json

@@ -25,6 +25,7 @@
     "guide",
     "javascript",
     "ecmascript",
+    "prettier",
     "eslint",
     "eslint-config",
     "rule",
@@ -33,7 +34,8 @@
   "main": "index.js",
   "files": [
     "rules",
-    "index.js"
+    "index.js",
+    "prettier.js"
   ],
   "publishConfig": {
     "access": "public"
@@ -47,11 +49,15 @@
   },
   "devDependencies": {
     "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-plugin-prettier": "^3.3.1",
     "eslint-find-rules": "^3.6.1",
     "eslint-plugin-import": "^2.22.1"
   },
   "peerDependencies": {
     "eslint": "^7.23.0",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-import": "^2.22.1"
   }
 }

packages/@arcticicestudio/eslint-config-base/prettier.js

@@ -0,0 +1,18 @@
+/*
+ * Copyright (c) 2018-present Arctic Ice Studio <[email protected]>
+ * Copyright (c) 2018-present Sven Greb <[email protected]>
+ * This source code is licensed under the MIT license found in the LICENSE file.
+ */
+
+/**
+ * Entry point for the Prettier plugin integration with compatibility support for the following ESLint plugins:
+ *
+ * - `eslint-plugin-react`
+ *
+ * @since 0.9.0
+ * @see https://github.com/prettier/eslint-plugin-prettier
+ * @see https://github.com/prettier/eslint-config-prettier
+ */
+module.exports = {
+  extends: ["./rules/prettier"].map(require.resolve),
+};

packages/@arcticicestudio/eslint-config/rules/prettier/index.js → packages/@arcticicestudio/eslint-config-base/rules/prettier/index.js

@@ -7,7 +7,7 @@
 /**
  * Prettier plugin rules.
  *
- * @since 0.5.0
+ * @since 0.9.0
  * @see https://github.com/prettier/eslint-plugin-prettier
  * @see https://github.com/prettier/eslint-config-prettier
  * @see https://prettier.io

packages/@arcticicestudio/eslint-config/README.md

@@ -10,7 +10,7 @@
 
 <p align="center"><a href="https://github.com/arcticicestudio/styleguide-javascript/actions" target="_blank" rel="noreferrer"><img src="https://img.shields.io/github/workflow/status/arcticicestudio/styleguide-javascript/ci?style=flat-square&label=CI&logoColor=eceff4&colorA=4c566a&logo=github-actions"/></a></p>
 
-This package implements the rules of the [Arctic Ice Studio JavaScript style guide][gh-stg-repo] as an extensible shared [ESLint][] configuration with plugin support for [React][gh-esl-p-react] and its [_Hooks_][gh-esl-p-react-hooks], [JSX A11Y][gh-esl-p-jsx-a11y] and compatibility integrations for other projects like [Prettier][].
+This package implements the rules of the [Arctic Ice Studio JavaScript style guide][gh-stg-repo] as an extensible shared [ESLint][] configuration with plugin support for [React][gh-esl-p-react], its [_Hooks_][gh-esl-p-react-hooks] and [JSX A11Y][gh-esl-p-jsx-a11y].
 
 ## Getting Started
 
@@ -35,7 +35,7 @@ See the [Node distribution index][node-dist-index] for more information about wh
 
 #### Peer Dependencies
 
-This package depends on the [eslint-plugin-react][gh-esl-p-react], [eslint-plugin-jsx-a11y][gh-esl-p-jsx-a11y], [eslint-plugin-prettier][gh-esl-p-prettier] and [prettier][gh-prettier] packages that are defined as [peer dependencies][node-blog-peer_deps].
+This package depends on the [eslint-plugin-react][gh-esl-p-react] and [eslint-plugin-jsx-a11y][gh-esl-p-jsx-a11y] packages that are defined as [peer dependencies][node-blog-peer_deps].
 Since this configuration is build on top of the [base rules package][gh-t-pkg-esl-base], the additional [eslint-plugin-import][gh-esl-p-import] peer dependency is also required.
 
 ##### npm versions `>=7.0.0`
@@ -100,13 +100,7 @@ module.exports = {
     /*
      * Optional entry point to enable support for projects using React Hooks.
      */
-    "@arcticicestudio/eslint-config/react-hooks",
-    /*
-     * Optional entry point to enable support for projects using Prettier.
-     * Note that this must always be placed after the `@arcticicestudio/eslint-config` preset to take precedence,
-     * otherwise it won't prevent errors due to useless and possibly conflicting rules!
-     */
-    "@arcticicestudio/eslint-config/prettier"
+    "@arcticicestudio/eslint-config/react-hooks"
   ]
 };
 ```
@@ -116,7 +110,6 @@ module.exports = {
 This package provides multiple entry points that can be composed especially for the projects they are used in:
 
 - `@arcticicestudio/eslint-config` — The default entry point that includes the base rules of the [@arcticicestudio/eslint-config-base][gh-t-pkg-esl-base] package as well as additional rules from the [eslint-plugin-react][gh-esl-p-react] and [eslint-plugin-jsx-a11y][gh-esl-p-jsx-a11y] packages.
-- `@arcticicestudio/eslint-config/prettier` — Entry point to enable support for [Prettier][] through [eslint-plugin-prettier][gh-esl-p-prettier] and the officially recommended Prettier ESLint configuration using the [eslint-config-prettier][gh-esl-c-prettier] package. It disables possibly conflicting rules and rules that definitely not needed when using _Prettier_ for code formatting. There is also additional support when _Prettier_ is used for React based projects by extending the special `prettier/react` configuration that also disables specific `react/` and JSX rules. Note that this configuration **should always be placed after `@arcticicestudio/eslint-config`** in order to override conflicting rules, otherwise the `@arcticicestudio/eslint-config` preset will take precedence leaving conflicting rules untouched!
 - `@arcticicestudio/eslint-config/react-hooks` — Entry point to enable support for [React _Hooks_][react-d-hooks] through [eslint-plugin-react-hooks][gh-esl-p-react-hooks].
 
 ## Contributing
@@ -133,14 +126,11 @@ Please read the [contribution guidelines][gh-stg-b-readme#contrib] of the [Arcti
 [esl-d-config#ext_conf]: https://eslint.org/docs/user-guide/configuring#extending-configuration-files
 [eslint]: https://eslint.org
 [gh-blog-npm_v7]: https://github.blog/2020-10-13-presenting-v7-0-0-of-the-npm-cli
-[gh-esl-c-prettier]: https://github.com/prettier/eslint-config-prettier
 [gh-esl-p-import]: https://github.com/benmosher/eslint-plugin-import
 [gh-esl-p-jsx-a11y]: https://github.com/evcohen/eslint-plugin-jsx-a11y
-[gh-esl-p-prettier]: https://github.com/prettier/eslint-plugin-prettier
 [gh-esl-p-react-hooks]: https://github.com/facebook/react/tree/master/packages/eslint-plugin-react-hooks
 [gh-esl-p-react]: https://github.com/yannickcr/eslint-plugin-react
 [gh-npm/rfcs-blob-install_peer_deps]: https://github.com/npm/rfcs/blob/latest/implemented/0025-install-peer-deps.md
-[gh-prettier]: https://github.com/prettier/prettier
 [gh-remarkjs/remark-lint]: https://github.com/remarkjs/remark-lint
 [gh-stg-b-readme#contrib]: https://github.com/arcticicestudio/styleguide-javascript#contributing
 [gh-stg-repo]: https://github.com/arcticicestudio/styleguide-javascript
@@ -150,6 +140,5 @@ Please read the [contribution guidelines][gh-stg-b-readme#contrib] of the [Arcti
 [node-dist-v8-latest]: https://nodejs.org/dist/latest-v8.x
 [npm-install-peerdeps]: https://www.npmjs.com/package/install-peerdeps
 [npm-npx]: https://www.npmjs.com/package/npx
-[prettier]: https://prettier.io
 [react-d-hooks]: https://reactjs.org/docs/hooks-intro.html
 [yarn-classic]: https://classic.yarnpkg.com

packages/@arcticicestudio/eslint-config/package.json

@@ -28,7 +28,6 @@
     "eslint",
     "react",
     "a11y",
-    "prettier",
     "eslint-config",
     "rule",
     "preset"
@@ -37,7 +36,6 @@
   "files": [
     "rules",
     "index.js",
-    "prettier.js",
     "react-hooks.js"
   ],
   "publishConfig": {
@@ -52,20 +50,16 @@
   },
   "devDependencies": {
     "eslint": "^7.23.0",
-    "eslint-config-prettier": "^8.1.0",
     "eslint-find-rules": "^3.6.1",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-react": "^7.23.1",
     "eslint-plugin-react-hooks": "^4.2.0"
   },
   "peerDependencies": {
     "eslint": "^7.23.0",
-    "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-react": "^7.23.1",
     "eslint-plugin-react-hooks": "^4.2.0"
   }

packages/@arcticicestudio/eslint-config/prettier.js

@@ -9,10 +9,12 @@
  *
  * - `eslint-plugin-react`
  *
- * @since 0.5.0
+ * @since 0.9.0
+ * @deprecated Moved into the @arcticicestudio/eslint-config-base package.
+ * This entry point will be removed in version 1.0.0.
  * @see https://github.com/prettier/eslint-plugin-prettier
  * @see https://github.com/prettier/eslint-config-prettier
  */
 module.exports = {
-  extends: ["./rules/prettier"].map(require.resolve),
+  /* Deprecated */
 };