Eslint-plugin-perfectionist-align NPM

ESLint Plugin Perfectionist Align

This README.md inspired by eslint-plugin-perfectionist.

ESLint plugin that sets rules to format your code and make it consistent.

This plugin defines rules for align imports, assignments, etc.

All rules are automatically fixable. It's safe!

📖 What is this?

This plugin / rule will align:

from

import defaultExport from "module-name";
import * as name from "module-name";
import { export1 } from "module-name";
import { export2 as alias1 } from "module-name";
import { export3, export4 } from "module-name";
import { foo, bar } from "module-name/path/to/specific/un-exported/file";
import { export5, export6 as alias7 } from "module-name";
import defaultExport2, { export8 } from "module-name";
import defaultExport3, * as name2 from "module-name";

// Align assignments
const foo = 1;
const foo100 = 2;
const foo1000000 = 234;


// Eslint object align, read eslint.config.js
const someObj = {
  someKey : true,
  otherLongKey : false,
  oneMoreVeryLongKey : 'some_string_value',
  randomNumberKey : 5,
  [foox] : null,
  someArrowFunctionExpression : () => {},
};

to

import defaultExport                   from "module-name";
import * as name                       from "module-name";
import { export1 }                     from "module-name";
import { export2 as alias1 }           from "module-name";
import { export3 , export4 }           from "module-name";
import { foo , bar }                   from "module-name/path/to/specific/un-exported/file";
import { export5 , export6 as alias7 } from "module-name";
import defaultExport2, { export8 }     from "module-name";
import defaultExport3, * as name2      from "module-name";

// Align assignments
const foo        = 1;
const foo100     = 2;
const foo1000000 = 234;

// Eslint object align, read eslint.config.js
const someObj = {
  someKey                     : true,
  otherLongKey                : false,
  oneMoreVeryLongKey          : 'some_string_value',
  randomNumberKey             : 5,
  [foox]                      : null,
  someArrowFunctionExpression : () => {},
};

// For JSDoc alignment, use eslint-plugin-jsdoc (#See Also)
class Foo {
  /**
   *  Some method
      *  
* @param a
   */
  quu(a) {}
}

💿 Installation

You'll first need to install ESLint:

npm install --save-dev eslint

Next, install eslint-plugin-perfectionist-align:

npm install --save-dev eslint-plugin-perfectionist-align

🚀️️️️ Usage

Add eslint-plugin-perfectionist-align to the plugins section of the ESLint configuration file and define the list of rules you will use.

Legacy Config (`.eslintrc`)

{
  "plugins": [
    "perfectionist-align"
  ],
  "rules": {
    "perfectionist-align/align-import": ["warn"]
}

Flat Config (`eslint.config.js`) (requires eslint >= v8.23.0)

Read more about migration and setup your eslint.config.js:

// For ES6 import, read migration link
const { FlatCompat } = require("@eslint/eslintrc");

const compat = new FlatCompat({
  baseDirectory: __dirname,
});

module.exports = [
  ...compat.config({
    plugins: ["perfectionist-align"],
    rules: {
      "perfectionist-align/align-import": [1],
    },
  }),
];

⚙️ Configs

The easiest way to use eslint-plugin-perfectionist-align is to use ready-made configs. Config files use all the rules of the current plugin, but you can override them.

Legacy Config (`.eslintrc`)

{
  "extends": [
    "plugin:perfectionist-align/recommended"
  ]
}

Flat Config (`eslint.config.js`)

// For ES6 import, read migration link
const { FlatCompat } = require('@eslint/eslintrc');

const compat = new FlatCompat({
  baseDirectory : __dirname,
});

module.exports = [
    ...compat.config({
        extends : [
       'plugin:perfectionist-align/recommended'
    ]
    })
];

List of Configs

Name	Description
recommended	all plugin rules with warning level

✅ Rules

🔧 Automatically fixable by the --fix CLI option.

Name	Description	🔧
align-import	`author` simonwep - Aligns your import statements.	🔧
align-assignment	`author` lucasefe - Alignment of assignment declarations in a group.	🔧

⁉️ FAQ

Can I automatically fix problems in the editor?

Yes. To do this, you need to enable autofix in ESLint when you save the file in your editor.

To disable autofix, i recommend no-autofix plugin.

⚠️ Troubleshooting

There are rules of ESLint and other ESLint plugins that may conflict with the rules of ESLint Plugin Perfectionist Align. We strongly recommend that you disable rules with similar functionality.