eslint-config
Create ESLint configuration for any project.
Presentation
ESLint config file consists into a single big object.
This package helps to split this big object into smaller objects.
This is possible thanks to a function capable to compose objects together to obtain a final object needed to configure ESLint.
composeEslintConfig
composeEslintConfig is a function returning an eslint config object being the composition of eslint config objects passed in arguments.
const { composeEslintConfig, eslintConfigBase } = require("@jsenv/eslint-config")
const eslintConfig = composeEslintConfig(
eslintConfigBase,
{
plugins: ["html"],
settings: {
extensions: [".html"],
},
},
{
plugins: ["react"],
settings: {
extensions: [".jsx"],
},
},
)
module.exports = eslintConfig
Composable eslint configs
Advanced configuration example
The following code is meant to be put into an .eslintrc.cjs file and does the following:
- Reuse jsenv configuration for ESLint rules
- Disable ESLint rules already handled by prettier
- Use ESLint import plugin with a custom resolver
- Use html plugin to enable linting of html files
- Consider files as written for browsers by default
- Consider a subset of files as written for Node.js
const {
composeEslintConfig,
eslintConfigBase,
eslintConfigForPrettier,
jsenvEslintRules,
jsenvEslintRulesForImport,
} = require("@jsenv/eslint-config")
const eslintConfig = composeEslintConfig(
eslintConfigBase,
{
rules: {
...jsenvEslintRules,
"operator-assignment": ["error", "always"],
},
},
eslintConfigForPrettier,
{
plugins: ["import"],
settings: {
"import/resolver": {
["@jsenv/importmap-eslint-resolver"]: {
projectDirectoryUrl: __dirname,
importMapFileRelativeUrl: "./import-map.importmap",
},
},
},
rules: jsenvEslintRulesForImport,
},
{
plugins: ["html"],
settings: {
extensions: [".html"],
},
},
{
env: {
browser: true,
},
},
{
overrides: [
{
files: ["**/*.mjs"],
env: {
browser: false,
node: true,
},
globals: {
__filename: "off",
__dirname: "off",
require: "off",
},
settings: {
"import/resolver": {
[importResolverPath]: {
node: true,
},
},
},
},
],
},
{
overrides: [
{
files: ["**/*.cjs"],
env: {
browser: false,
node: true,
},
globals: {
__filename: true,
__dirname: true,
require: true,
},
settings: {
"import/resolver": {
[importResolverPath]: {
node: true,
},
},
},
},
],
},
)
module.exports = eslintConfig
Composable ESLint rules
More
Enable ESLint for html files in VsCode
Add
"eslint.validate": ["javascript", "html"]
In .vscode/settings.json