This package provides Climatiq's ESLint configuration as a base config for any project in Climatiq and requires @next/eslint-plugin-next
,@typescript-eslint/eslint-plugin
,@typescript-eslint/parser
,eslint
,eslint-config-next
,eslint-config-prettier
,eslint-plugin-prettier
,eslint-webpack-plugin
,prettier
,typescript
To install this config and the peerDependencies (note the npx
command). If you are using yarn, the command will detect it and will prompt to use yarn command instead.
yarn add --dev @climatiq/eslint-config
Now create an ESLint configuration file for your project that extends Climatiq's rules:
// eslint.rc.js
module.exports = {
"extends": ["@climatiq"],
parserOptions: {
project: true,
tsconfigRootDir: __dirname,
},
}
Or use it directly on the command line:
npx eslint -c @climatiq/eslint-config ./src
When webpack is running and watching for changes, the eslint-webpack-plugin
allows to run ESLint while watching by adding these lines to your webpack.config.js
file:
const ESLintPlugin = require('eslint-webpack-plugin');
module.exports = {
// ...
plugins: [
// ...,
new ESLintPlugin({
extensions: ['js', 'ts', 'tsx', 'jsx'],
exclude: ['/node_modules/'],
failOnError: false,
files: [], // List of files/folders to run the lint while linting
})
]
}
You can extend Next configuration to modify the webpack configuration object in a similar way:
const ESLintPlugin = require('eslint-webpack-plugin');
module.exports = {
reactStrictMode: true,
webpack: (config, { dev }) => {
if (dev) {
config.plugins.push(
new ESLintPlugin({
extensions: ['js', 'ts', 'tsx', 'jsx'],
exclude: ['/node_modules/', '/.next/', '/public/'],
failOnError: false,
files: [], // List of files/folders to run the lint while linting
}),
);
}
return config;
},
};