Skip to content

Commit 5596342

Browse files
committed
chore: modernise eslint setup
1 parent 5d4c1ef commit 5596342

7 files changed

+905
-457
lines changed

.eslintrc.js

+48-89
Original file line numberDiff line numberDiff line change
@@ -1,107 +1,66 @@
1-
const ERROR = 2
2-
const WARN = 1
3-
const OFF = 0
4-
5-
/**
6-
* Not using `gatsby-plugin-eslint`, as it's outdated and doesn't really
7-
* accomplish anything that hasn't been taken care of already. Feel free to look
8-
* into it for yourself: https://www.gatsbyjs.org/packages/gatsby-plugin-eslint/
9-
*
10-
* @see https://eslint.org/docs/user-guide/configuring/
11-
* @type {eslint.BaseConfig}
12-
*/
1+
const path = require('path');
132
module.exports = {
14-
/**
15-
* @type {eslint.BaseConfig.env}
16-
*/
3+
root: true,
4+
parser: '@typescript-eslint/parser', // Specifies the ESLint parser
5+
plugins: [
6+
'@typescript-eslint',
7+
'import',
8+
],
9+
extends: [
10+
'eslint:recommended',
11+
'plugin:@typescript-eslint/eslint-recommended',
12+
'plugin:@typescript-eslint/recommended',
13+
'plugin:import/recommended',
14+
'plugin:import/typescript',
15+
'plugin:prettier/recommended',
16+
'plugin:react/recommended',
17+
'prettier', // enables eslint-plugin-prettier and eslint-config-prettier
18+
],
1719
env: {
1820
browser: true,
1921
es2020: true,
2022
node: true,
2123
},
22-
23-
/**
24-
* @see https://github.com/standard/eslint-config-standard-react
25-
* @see https://github.com/standard/eslint-config-standard-with-typescript
26-
* @see https://github.com/benmosher/eslint-plugin-import
27-
*/
28-
extends: [
29-
'standard-react',
30-
'standard-with-typescript',
31-
'plugin:import/errors',
32-
'plugin:import/warnings',
33-
'prettier',
34-
],
35-
36-
globals: {
37-
__PATH_PREFIX__: true,
38-
Atomics: 'readonly',
39-
SharedArrayBuffer: 'readonly',
40-
},
41-
42-
/**
43-
* @see https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/parser
44-
*/
45-
parser: '@typescript-eslint/parser',
46-
47-
/**
48-
* @type {eslint.BaseConfig.parserOptions}
49-
*/
5024
parserOptions: {
25+
ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
26+
sourceType: 'module', // Allows for the use of imports
5127
ecmaFeatures: {
52-
impliedStrict: true,
53-
jsx: true,
28+
jsx: true, // Allows for the parsing of JSX
5429
},
55-
ecmaVersion: 2020,
56-
project: './tsconfig.json',
57-
sourceType: 'module',
30+
project: path.resolve(__dirname, './tsconfig.json'),
31+
tsconfigRootDir: __dirname,
5832
},
33+
rules: {
34+
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
35+
'@typescript-eslint/explicit-function-return-type': 'off',
36+
'@typescript-eslint/no-non-null-assertion': 'warn',
37+
'@typescript-eslint/no-empty-function': 'warn',
38+
'@typescript-eslint/no-var-requires': 'warn',
39+
'react/prop-types': 'off',
40+
'@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
41+
'react/no-unescaped-entities': 'warn',
42+
'@typescript-eslint/ban-types': 'warn',
43+
'@typescript-eslint/explicit-module-boundary-types': 'off',
5944

60-
/**
61-
* @see https://github.com/yannickcr/eslint-plugin-react
62-
*/
63-
plugins: ['react'],
45+
// Imports
46+
'import/no-duplicates': 'error',
47+
'import/no-named-as-default': 'off',
48+
'import/no-named-as-default-member': 'off',
6449

65-
rules: {
66-
'comma-dangle': [WARN, 'always-multiline'],
67-
'no-cond-assign': [ERROR, 'always'],
68-
'quote-props': [WARN, 'consistent-as-needed'],
50+
'prettier/prettier': 'warn',
6951
},
70-
71-
/**
72-
* @type {eslint.BaseConfig.settings}
73-
*/
7452
settings: {
7553
react: {
76-
version: 'detect',
54+
version: 'detect', // Tells eslint-plugin-react to automatically detect the version of React to use
7755
},
78-
},
79-
80-
overrides: [
81-
{
82-
files: ['*.ts', '*.tsx'],
83-
84-
extends: [
85-
'plugin:@typescript-eslint/recommended',
86-
'plugin:@typescript-eslint/recommended-requiring-type-checking',
87-
'plugin:import/typescript',
88-
],
89-
90-
/**
91-
* @see https://github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin
92-
*/
93-
plugins: ['@typescript-eslint'],
94-
95-
/**
96-
* @see https://github.com/yannickcr/eslint-plugin-react
97-
*/
98-
rules: {
99-
'react/prop-types': OFF,
100-
'@typescript-eslint/consistent-type-definitions': [ERROR, 'type'],
101-
'@typescript-eslint/explicit-function-return-type': ERROR,
102-
'@typescript-eslint/require-await': OFF,
103-
'@typescript-eslint/strict-boolean-expressions': OFF,
56+
'import/resolver': {
57+
typescript: {
58+
alwaysTryTypes: true,
59+
project: 'tsconfig.json',
60+
},
61+
node: {
62+
extensions: ['.ts', '.tsx'],
10463
},
10564
},
106-
],
107-
}
65+
},
66+
};

.prettierrc

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"semi": true,
3+
"singleQuote": true,
4+
"tabWidth": 4,
5+
"trailingComma": "none",
6+
"useTabs": false,
7+
"bracketSpacing": true,
8+
"arrowParens": "avoid"
9+
}

gatsby-ssr.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,12 @@ var onRenderBody = function (_a) {
1414
setHeadComponents([
1515
helmet.base.toComponent(),
1616
helmet.title.toComponent(),
17+
helmet.priority.toComponent(),
1718
helmet.meta.toComponent(),
1819
helmet.link.toComponent(),
1920
helmet.style.toComponent(),
2021
helmet.script.toComponent(),
21-
helmet.noscript.toComponent(),
22+
helmet.noscript.toComponent()
2223
]);
2324
setHtmlAttributes(helmet.htmlAttributes.toComponent());
2425
setBodyAttributes(helmet.bodyAttributes.toComponent());

package.json

+54-49
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,56 @@
11
{
2-
"name": "gatsby-plugin-react-helmet-async",
3-
"version": "1.2.1",
4-
"description": "Use react-helmet-async with Gatsby",
5-
"keywords": [
6-
"gatsby",
7-
"gatsby-plugin",
8-
"react",
9-
"react-helmet",
10-
"react-helmet-async"
11-
],
12-
"homepage": "https://github.com/Collabsalot/gatsby-plugin-react-helmet-async#readme",
13-
"bugs": {
14-
"url": "https://github.com/Collabsalot/gatsby-plugin-react-helmet-async/issues"
15-
},
16-
"repository": {
17-
"type": "git",
18-
"url": "git+https://github.com/Collabsalot/gatsby-plugin-react-helmet-async.git"
19-
},
20-
"license": "Apache-2.0",
21-
"author": "Martin Rosenberg <Martin.B.Rosenberg@gmail.com> (https://martinbrosenberg.com)",
22-
"main": "index.js",
23-
"scripts": {
24-
"build": "tsc --build",
25-
"clean": "rm gatsby-browser.d.ts gatsby-browser.js gatsby-ssr.d.ts gatsby-ssr.js",
26-
"lint": "eslint src --ext ts,tsx --fix",
27-
"test": "echo \"Error: no tests specified\" && exit 1"
28-
},
29-
"devDependencies": {
30-
"@typescript-eslint/eslint-plugin": "^4.28.0",
31-
"@typescript-eslint/parser": "^4.28.0",
32-
"eslint": "^7.29.0",
33-
"eslint-config-standard-react": "^11.0.1",
34-
"eslint-config-standard-with-typescript": "^20.0.0",
35-
"eslint-plugin-import": "^2.23.4",
36-
"eslint-plugin-node": "^11.1.0",
37-
"eslint-plugin-promise": "^5.1.0",
38-
"eslint-plugin-react": "^7.24.0",
39-
"gatsby": "^3.8.0",
40-
"react": "^17.0.2",
41-
"react-dom": "^17.0.2",
42-
"react-helmet-async": "^1.0.9",
43-
"typescript": "^4.3.4"
44-
},
45-
"peerDependencies": {
46-
"gatsby": ">=2",
47-
"react": "^16.6.0 || 17.x",
48-
"react-dom": "^16.6.0 || 17.x",
49-
"react-helmet-async": "1.x"
50-
}
2+
"name": "gatsby-plugin-react-helmet-async",
3+
"version": "1.2.1",
4+
"description": "Use react-helmet-async with Gatsby",
5+
"keywords": [
6+
"gatsby",
7+
"gatsby-plugin",
8+
"react",
9+
"react-helmet",
10+
"react-helmet-async"
11+
],
12+
"homepage": "https://github.com/Collabsalot/gatsby-plugin-react-helmet-async#readme",
13+
"bugs": {
14+
"url": "https://github.com/Collabsalot/gatsby-plugin-react-helmet-async/issues"
15+
},
16+
"repository": {
17+
"type": "git",
18+
"url": "git+https://github.com/Collabsalot/gatsby-plugin-react-helmet-async.git"
19+
},
20+
"license": "Apache-2.0",
21+
"author": "Martin Rosenberg <Martin.B.Rosenberg@gmail.com> (https://martinbrosenberg.com)",
22+
"main": "index.js",
23+
"scripts": {
24+
"build": "tsc --build",
25+
"clean": "rm gatsby-browser.d.ts gatsby-browser.js gatsby-ssr.d.ts gatsby-ssr.js",
26+
"lint": "eslint src --ext ts,tsx --fix",
27+
"test": "echo \"Error: no tests specified\" && exit 1"
28+
},
29+
"devDependencies": {
30+
"@typescript-eslint/eslint-plugin": "^5.27.1",
31+
"@typescript-eslint/parser": "^5.27.1",
32+
"eslint": "^8.17.0",
33+
"eslint-config-prettier": "^8.5.0",
34+
"eslint-config-standard-react": "^11.0.1",
35+
"eslint-config-standard-with-typescript": "^20.0.0",
36+
"eslint-import-resolver-typescript": "^2.7.1",
37+
"eslint-plugin-import": "^2.26.0",
38+
"eslint-plugin-node": "^11.1.0",
39+
"eslint-plugin-prettier": "^4.0.0",
40+
"eslint-plugin-promise": "^6.0.0",
41+
"eslint-plugin-react": "^7.30.0",
42+
"gatsby": "^3.8.0",
43+
"prettier": "^2.6.2",
44+
"prettier-eslint": "^15.0.1",
45+
"react": "^17.0.2",
46+
"react-dom": "^17.0.2",
47+
"react-helmet-async": "^1.3.0",
48+
"typescript": "^4.7.3"
49+
},
50+
"peerDependencies": {
51+
"gatsby": ">=2",
52+
"react": "^16.6.0 || ^17 || ^18",
53+
"react-dom": "^16.6.0 || ^17 || ^18",
54+
"react-helmet-async": "1.x"
55+
}
5156
}

src/gatsby-browser.tsx

+8-8
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { GatsbyBrowser, WrapRootElementBrowserArgs } from 'gatsby'
2-
import React from 'react'
3-
import { HelmetProvider } from 'react-helmet-async'
1+
import { GatsbyBrowser, WrapRootElementBrowserArgs } from 'gatsby';
2+
import React from 'react';
3+
import { HelmetProvider } from 'react-helmet-async';
44

5-
export const wrapRootElement: GatsbyBrowser['wrapRootElement'] = (
6-
{ element }: WrapRootElementBrowserArgs,
7-
): any => (
8-
<HelmetProvider>{element}</HelmetProvider>
9-
)
5+
export const wrapRootElement: GatsbyBrowser['wrapRootElement'] = ({
6+
element
7+
}: WrapRootElementBrowserArgs): React.ReactElement => (
8+
<HelmetProvider>{element}</HelmetProvider>
9+
);

src/gatsby-ssr.tsx

+29-29
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,34 @@
1-
import { GatsbySSR, RenderBodyArgs, WrapRootElementNodeArgs } from 'gatsby'
2-
import React from 'react'
3-
import { HelmetData, HelmetProvider } from 'react-helmet-async'
1+
import { GatsbySSR, RenderBodyArgs, WrapRootElementNodeArgs } from 'gatsby';
2+
import React from 'react';
3+
import { HelmetProvider, HelmetServerState } from 'react-helmet-async';
44

5-
const context: { helmet?: HelmetData } = {}
5+
const context: { helmet?: HelmetServerState } = {};
66

77
export const onRenderBody: GatsbySSR['onRenderBody'] = ({
8-
setHeadComponents,
9-
setHtmlAttributes,
10-
setBodyAttributes,
11-
}: RenderBodyArgs): any => {
12-
const { helmet } = context
8+
setHeadComponents,
9+
setHtmlAttributes,
10+
setBodyAttributes
11+
}: RenderBodyArgs): void => {
12+
const { helmet } = context;
1313

14-
if (helmet != null) {
15-
setHeadComponents([
16-
helmet.base.toComponent(),
17-
helmet.title.toComponent(),
18-
helmet.priority.toComponent(),
19-
helmet.meta.toComponent(),
20-
helmet.link.toComponent(),
21-
helmet.style.toComponent(),
22-
helmet.script.toComponent(),
23-
helmet.noscript.toComponent(),
24-
])
25-
setHtmlAttributes(helmet.htmlAttributes.toComponent())
26-
setBodyAttributes(helmet.bodyAttributes.toComponent())
27-
}
28-
}
14+
if (helmet != null) {
15+
setHeadComponents([
16+
helmet.base.toComponent(),
17+
helmet.title.toComponent(),
18+
helmet.priority.toComponent(),
19+
helmet.meta.toComponent(),
20+
helmet.link.toComponent(),
21+
helmet.style.toComponent(),
22+
helmet.script.toComponent(),
23+
helmet.noscript.toComponent()
24+
]);
25+
setHtmlAttributes(helmet.htmlAttributes.toComponent());
26+
setBodyAttributes(helmet.bodyAttributes.toComponent());
27+
}
28+
};
2929

30-
export const wrapRootElement: GatsbySSR['wrapRootElement'] = (
31-
{ element }: WrapRootElementNodeArgs,
32-
): any => (
33-
<HelmetProvider context={context}>{element}</HelmetProvider>
34-
)
30+
export const wrapRootElement: GatsbySSR['wrapRootElement'] = ({
31+
element
32+
}: WrapRootElementNodeArgs): React.ReactElement => (
33+
<HelmetProvider context={context}>{element}</HelmetProvider>
34+
);

0 commit comments

Comments
 (0)