CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-eslint-config-recommended

Comprehensive ESLint configuration package with pluggable configs for ECMAScript Next, Node.js and React Native

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

esnext.mddocs/

ESNext Configuration

ESNext configuration provides comprehensive ESLint rules for modern JavaScript/ECMAScript Next features. It serves as the foundation configuration that other environment-specific configs extend from, focusing on safety checks and best practices with a bias toward code concision and brevity.

Capabilities

Base ESNext Configuration

Core configuration for modern JavaScript development with ES6+ features, modules, and safety checks.

/**
 * Base ESNext ESLint configuration
 * Accessible as: "esnext" or "recommended/esnext"
 */
env:
  es6: true               # Enable ES6 globals and features
  commonjs: true          # Enable CommonJS global variables

parser: babel-eslint      # Use babel-eslint for parsing modern syntax

parserOptions:
  ecmaVersion: 2018       # Support up to ES2018 features
  sourceType: module      # Enable ES6 modules
  ecmaFeatures:
    impliedStrict: true   # Apply strict mode to all code
    modules: true         # Enable ES6 module features

extends:
  - eslint:recommended              # Base ESLint recommended rules
  - plugin:import/errors            # Import plugin error rules
  - plugin:import/warnings          # Import plugin warning rules

Environment Settings:

  • es6: true: Enables ES6 global variables (Set, Map, Promise, etc.) and ES6 syntax
  • commonjs: true: Enables CommonJS globals (require, module, exports, etc.)

Parser Configuration:

  • babel-eslint: Enables parsing of all Babel-supported code including experimental features
  • ecmaVersion: 2018: Supports syntax up to ES2018 (async/await, object rest/spread, etc.)
  • sourceType: module: Treats code as ES6 modules
  • impliedStrict: true: Automatically applies strict mode to all JavaScript code

ESNext Safety Rules

Comprehensive set of safety and best practice rules beyond ESLint's recommended set.

/**
 * ESNext-specific safety rules
 * These rules are added on top of eslint:recommended
 */
rules: {
  // Array and callback rules
  "array-callback-return": "error",        // Enforce return in array callbacks
  
  // Arrow function rules  
  "arrow-body-style": "error",             // Require braces around arrow function bodies as needed
  
  // Class rules
  "class-methods-use-this": "error",       // Disallow class methods that don't use this
  
  // Property access rules
  "dot-notation": "error",                 // Enforce dot notation for property access
  
  // Equality rules
  "eqeqeq": "error",                      // Require === and !==
  
  // Function rules
  "no-alert": "error",                     // Disallow alert, confirm, prompt
  "no-empty-function": "error",            # Disallow empty functions
  "no-else-return": "error",              // Disallow else after return in if
  "no-eval": "error",                     // Disallow eval()
  "no-extend-native": "error",            // Disallow extending native objects
  "no-extra-bind": "error",               // Disallow unnecessary bind()
  "no-global-assign": "error",            // Disallow assignment to global variables  
  "no-implicit-globals": "error",         // Disallow var and function declarations in global scope
  "no-implied-eval": "error",             // Disallow implied eval()
  "no-invalid-this": "error",             // Disallow this outside class/function context
  "no-lonely-if": "error",                // Disallow if as only statement in else block
  "no-loop-func": "error",                // Disallow functions in loops
  "no-new": "error",                      // Disallow new without assignment
  "no-new-func": "error",                 // Disallow Function constructor
  "no-new-wrappers": "error",             // Disallow primitive wrapper constructors
  "no-proto": "error",                    // Disallow __proto__ property
  "no-script-url": "error",               // Disallow javascript: URLs
  "no-self-compare": "error",             // Disallow self comparison
  "no-throw-literal": "error",            // Disallow throwing literal values
  "no-unmodified-loop-condition": "error", // Require loop condition to be modified
  "no-unneeded-ternary": ["error", { "defaultAssignment": false }], // Disallow unnecessary ternary
  "no-unsafe-negation": "error",          // Disallow negation of left operand of relational operators
  "no-unused-expressions": ["error", {   // Disallow unused expressions
    "allowTernary": true,                 // Allow ternary as shorthand for if/else
    "allowShortCircuit": true             // Allow && and || as shorthand for if
  }],
  "no-use-before-define": ["error", "nofunc"], // Disallow use before define (ignore functions)
  "no-useless-call": "error",             // Disallow unnecessary call() and apply()
  "no-useless-computed-key": "error",     // Disallow unnecessary computed property keys
  "no-useless-concat": "error",           // Disallow unnecessary string concatenation
  "no-useless-constructor": "error",      // Disallow unnecessary constructors
  "no-useless-rename": "error",           // Disallow renaming to same name
  "no-var": "error",                      // Require let/const instead of var
  "no-with": "error",                     // Disallow with statements
  
  // Object rules
  "object-shorthand": "error",            // Require object shorthand syntax
  
  // Operator rules  
  "operator-assignment": "error",         // Require assignment operator shorthand
  
  // ES6 preference rules
  "prefer-arrow-callback": "error",       // Prefer arrow functions as callbacks
  "prefer-const": "error",                // Prefer const for never reassigned variables
  "prefer-rest-params": "error",          // Prefer rest parameters over arguments
  "prefer-spread": "error",               // Prefer spread over apply()
  
  // Condition rules (override eslint:recommended)
  "no-constant-condition": ["error", { "checkLoops": false }] // Allow infinite generators
}

Import Plugin Rules

Enhanced import/export validation and best practices from eslint-plugin-import.

/**
 * Import plugin rules for module validation
 * Included via extends: plugin:import/errors and plugin:import/warnings
 */
rules: {
  // Module resolution (errors)
  "import/no-unresolved": "error",        // Ensure imports resolve to actual files
  "import/named": "error",                // Ensure named imports exist in target module
  "import/namespace": "error",            // Ensure namespace imports are valid
  "import/default": "error",              // Ensure default import exists when used
  "import/export": "error",               // Report invalid exports
  
  // Import best practices (warnings)  
  "import/no-named-as-default": "warn",   // Warn on using exported name as default identifier
  "import/no-named-as-default-member": "warn", // Warn on using export as property of default
  
  // ESNext-specific import rules (errors)
  "import/no-amd": "error",               // Disallow AMD require/define
  "import/no-commonjs": "error",          // Disallow CommonJS require/exports
  "import/no-duplicates": "error",        // Disallow duplicate imports
  "import/no-extraneous-dependencies": "error", // Disallow imports not in package.json
  "import/no-mutable-exports": "error",   // Disallow var/let exports
  "import/no-namespace": "error",         // Disallow namespace imports
  "import/no-nodejs-modules": "error",    // Disallow Node.js built-in modules
  "import/prefer-default-export": "error" // Prefer default export for single export
}

Usage Examples

Basic ESNext Project

# .eslintrc.yaml
extends:
  - esnext

# Optional project-specific overrides
rules:
  no-console: warn

ESNext with Custom Rules

# .eslintrc.yaml  
extends:
  - esnext

rules:
  # Allow console in development
  no-console: off
  
  # Stricter import rules
  import/no-extraneous-dependencies: [error, { devDependencies: false }]
  
  # Allow some flexibility
  class-methods-use-this: warn

Library Development

# .eslintrc.yaml
extends:
  - esnext

rules:
  # Libraries should avoid console
  no-console: error
  
  # Prefer named exports for libraries
  import/prefer-default-export: off
  
  # Allow CommonJS for Node.js compatibility  
  import/no-commonjs: off

Common Rule Violations and Solutions

no-var Rule

// ❌ Error: Use of var
var name = 'John';
var items = [];

// ✅ Correct: Use let/const
const name = 'John';
let items = [];

prefer-const Rule

// ❌ Error: Variable never reassigned
let config = { debug: true };
let API_URL = 'https://api.example.com';

// ✅ Correct: Use const for never-reassigned variables
const config = { debug: true };
const API_URL = 'https://api.example.com';

no-duplicate-imports Rule

// ❌ Error: Duplicate imports
import { map } from 'lodash';
import { filter } from 'lodash';

// ✅ Correct: Single import statement
import { map, filter } from 'lodash';

import/no-commonjs Rule

// ❌ Error: CommonJS in ES6 module
const fs = require('fs');
module.exports = { helper };

// ✅ Correct: ES6 imports/exports  
import fs from 'fs';
export { helper };

arrow-body-style Rule

// ❌ Error: Unnecessary block body
const double = x => { return x * 2; };

// ✅ Correct: Concise arrow function
const double = x => x * 2;

// ✅ Also correct: Block body when needed
const process = x => {
  console.log(`Processing ${x}`);
  return x * 2;
};

prefer-arrow-callback Rule

// ❌ Error: Function callback instead of arrow
items.map(function(item) {
  return item.name;
});

// ✅ Correct: Arrow function callback
items.map(item => item.name);

Dependencies

Runtime Dependencies:

  • babel-eslint: ^10.0.1 - Parser for modern JavaScript syntax
  • eslint: ^6.8.0 - ESLint core
  • eslint-plugin-babel: ^5.2.1 - Babel-specific ESLint rules
  • eslint-plugin-import: ^2.14.0 - Import/export validation rules

Peer Dependencies:

  • eslint: ^6.0.0 - Required ESLint version for consuming projects

Installation

As Part of Recommended Package

npm install --save-dev eslint-config-recommended
# .eslintrc.yaml
extends:
  - recommended/esnext

As Standalone Package

npm install --save-dev eslint-config-esnext
# .eslintrc.yaml
extends:
  - esnext

Install with Tessl CLI

npx tessl i tessl/npm-eslint-config-recommended

docs

esnext.md

index.md

node.md

react-native.md

style-guides.md

tile.json