🪢 eslint-config-tonyfromundefined

Tony's ESLint Configuration, which considers import and property ordering important.

How to use

$ yarn add eslint-config-tonyfromundefined

// .eslintrc.js
module.exports = {
  root: true,
  extends: ["tonyfromundefined"],
}

Features

• TypeScript (@typescript-eslint/*)
• React App (eslint-config-react-app)
• Prettier (eslint-*-prettier)
• Perfectionist (eslint-plugin-perfectionist)
  • Sort Imports
  • Sort Object Keys
  • And more...
• JSON Format (eslint-plugin-json-format)
  • Sort JSON
  • Sort package.json
• Vanilla Extract property ordering by Recess
  • Using eslint-plugin-sort-keys-custom-order
  • with stylelint-config-recess-order

Examples

// Error
const myObject = {
  b: 2,
  a: 1,
};

// OK
const myObject = {
  a: 1,
  b: 2,
};

// Error
import MyComponent from "./MyComponent";
import { useEffect } from "react";

// OK
import { useEffect } from "react";

import MyComponent from "./MyComponent";

/**
 * Only works in `*.css.js`, `*.css.ts`
 */
import { style } from "@vanilla-extract/css"

// Error
export const myClassName = style({
  alignItems: "center",
  bottom: "1rem",
  display: "flex",
  left: "1rem",
  top: "1rem",
});

// OK
export const myClassName = style({
  top: "1rem",
  bottom: "1rem",
  left: "1rem",
  display: "flex",
  alignItems: "center",
});