swd-eslint-config

This is a custom eslint config for my projects. It uses the latest flat config version of eslint.

• Usage:

  • Install: pnpm add -D eslint prettier typescript-eslint swd-eslint-config jiti

  • In your eslint.config.ts:

    import swdEslintPlugin from 'swd-eslint-config'
    import tseslint from 'typescript-eslint'
    
    export default tseslint.config(
      ...swdEslintPlugin.configs.base,
      // if using React:
      ...swdEslintPlugin.configs.react(
        { framework: 'next' } // optional
      )
    )

    or the flat config with classic syntax:

    export default tseslint.config({
      extends: [
        ...swdEslintPlugin.configs.base,
        // if using React:
        ...swdEslintPlugin.configs.react(
          { framework: 'next' } // optional
        ),
      ],
    })

• Create a prettier config. Example:

  prettier.config.mjs

  /** @type {import("prettier").Config} */
  export default {
    endOfLine: 'lf', // consistency between windows and linux
    semi: false,
    singleQuote: true,
    jsxSingleQuote: true,
    tabWidth: 2,
    trailingComma: 'es5',
    lineWidth: 120,
  }

Troubleshooting

• If it doesn't work, try adding this to the .npmrc file:

  auto-install-peers = true
  public-hoist-pattern[]=*eslint*

• If using Expo, eslint-config-expo uses outdated versions, so you need to add the following to your package.json:

    "pnpm": {
      "overrides": {
        "eslint-plugin-react-hooks": "^5.0.0"
      }
    }

Plugins included:

• eslint-plugin-react
• eslint-plugin-jsx-a11y
• eslint-plugin-tailwindcss (experimental for tailwind v4)
• eslint-plugin-prettier
• eslint-plugin-simple-import-sort
• eslint-plugin-react-hooks
• typescript-eslint

Commands

• pnpm build - Builds the package
• pnpm release - Creates a new release, should be used before committing
• pnpm release:publish - Publishes the release, shouldn't be used manually