eslint-plugin-ember

An ESLint plugin that provides a set of rules for Ember applications based on commonly known good practices.

❗️Requirements

• ESLint >= 8
• Node.js 18.* || 20.* || >= 21

🚀 Usage

1. Install plugin

yarn add --dev eslint-plugin-ember

Or

npm install --save-dev eslint-plugin-ember

2. Update your config

// eslint.config.js (flat config)
const eslintPluginEmberRecommended = require('eslint-plugin-ember/configs/recommended');

module.exports = [
  ...eslintPluginEmberRecommended,
];

or

// .eslintrc.js (legacy config)
module.exports = {
  plugins: ['ember'],
  extends: [
    'eslint:recommended',
    'plugin:ember/recommended' // or other configuration
  ],
  rules: {
    // override / enable optional rules
    'ember/no-replace-test-comments': 'error'
  }
};

gts/gjs

lint files having First-Class Component Templates (fcct)

learn more here

[!NOTE] special care should be used when setting up parsers, since they cannot be overwritten. thus they should be used in override only and specific to file types

gjs/gts support is provided by the ember-eslint-parser

[!NOTE] if you import .gts files in .ts files, then ember-eslint-parser is required for .ts as well to enable typed linting

// .eslintrc.js
module.exports = {
  overrides: [
    {
      files: ['**/*.{js,ts}'],
      plugins: ['ember'],
      parser: '@typescript-eslint/parser',
      extends: [
        'eslint:recommended',
        'plugin:ember/recommended', // or other configuration
      ],
      rules: {
        // override / enable optional rules
        'ember/no-replace-test-comments': 'error'
      }
    },
    {
      files: ['**/*.gts'],
      parser: 'ember-eslint-parser',
      plugins: ['ember'],
      extends: [
        'eslint:recommended',
        'plugin:@typescript-eslint/recommended',
        'plugin:ember/recommended',
        'plugin:ember/recommended-gts',
      ],
    },
    {
      files: ['**/*.gjs'],
      parser: 'ember-eslint-parser',
      plugins: ['ember'],
      extends: [
        'eslint:recommended',
        'plugin:ember/recommended',
        'plugin:ember/recommended-gjs',
      ],
    },
    {
      files: ['tests/**/*.{js,ts,gjs,gts}'],
      rules: {
        // override / enable optional rules
        'ember/no-replace-test-comments': 'error'
      }
    },
  ],
};

rules applied to fcct templates

• semi rule, same as prettier plugin
• no-undef rule will take effect for template vars (includes js scope)
• no-unused rule will take effect for template block params

rules in templates can be disabled with eslint directives with mustache or html comments:

<template>
  <div>
    {{!eslint-disable-next-line}}
    {{test}}
  </div>
  <div>
    {{!--eslint-disable--}}
    {{test}}
    {{test}}
    {{test}}
    {{!--eslint-enable--}}
  </div>
</template>

<template>
  <div>
    <!--eslint-disable-next-line-->
    {{test}}
  </div>
  <div>
    <!-- eslint-disable -->
    {{test}}
    {{test}}
    {{test}}
    <!-- eslint-enable -->
  </div>
</template>

🧰 Configurations

	Name
	base
✅	recommended
	recommended-gjs
	recommended-gts

🍟 Rules

💼 Configurations enabled in.\ ✅ Set in the recommended configuration.\ Set in the recommended-gjs configuration.\ Set in the recommended-gts configuration.\ 🔧 Automatically fixable by the --fix CLI option.\ 💡 Manually fixable by editor suggestions.

Components

Computed Properties

Controllers

Deprecations

Ember Data

Ember Object

Ember Octane

Name	Description	💼	🔧	💡
classic-decorator-hooks	enforce using correct hooks for both classic and non-classic classes	✅
classic-decorator-no-classic-methods	disallow usage of classic APIs such as get/set in classes that aren't explicitly decorated with @classic	✅
no-actions-hash	disallow the actions hash in components, controllers, and routes	✅
no-classic-classes	disallow "classic" classes in favor of native JS classes	✅
no-ember-super-in-es-classes	disallow use of this._super in ES class methods	✅	🔧
no-empty-glimmer-component-classes	disallow empty backing classes for Glimmer components	✅
no-tracked-properties-from-args	disallow creating @tracked properties from this.args	✅
template-indent	enforce consistent indentation for gts/gjs templates		🔧
template-no-let-reference	disallow referencing let variables in \<template>

jQuery

Miscellaneous

Routes

Services

Stylistic Issues

Testing

🍻 Contribution Guide

If you have any suggestions, ideas, or problems, feel free to create an issue, but first please make sure your question does not repeat previous ones.

Creating a New Rule

• Create an issue with a description of the proposed rule
• Create files for the new rule:
  • lib/rules/new-rule.js (implementation, see no-proxies for an example)
  • docs/rules/new-rule.md (documentation, start from the template -- raw, rendered)
  • tests/lib/rules/new-rule.js (tests, see no-proxies for an example)
• Run yarn update to automatically update the README and other files (and re-run this if you change the rule name or description)
• Make sure your changes will pass CI by running:
  • yarn test
  • yarn lint (yarn lint:js --fix can fix many errors)
• Create a PR and link the created issue in the description

Note that new rules should not immediately be added to the recommended configuration, as we only consider such breaking changes during major version updates.

🔓 License

See the LICENSE file for license rights and limitations (MIT).