.eslintrc.js

/**
 * @type {import("@types/eslint").Linter.BaseConfig}
 */
module.exports = {
  extends: [
    'plugin:hydrogen/recommended',
    'plugin:hydrogen/typescript',
    'plugin:storybook/recommended',
    'plugin:import/recommended',
  ],
  plugins: ['check-file'],
  settings: {
    'import/resolver': {
      typescript: true,
      node: true,
    },
  },
  rules: {
    '@typescript-eslint/ban-ts-comment': 'off',
    '@typescript-eslint/naming-convention': 'off',
    'hydrogen/prefer-image-component': 'off',
    'no-useless-escape': 'off',
    '@typescript-eslint/no-non-null-asserted-optional-chain': 'off',
    'no-case-declarations': 'off',
    // TODO: Remove jest plugin from hydrogen/eslint-plugin
    'jest/no-deprecated-functions': 'off',
    'react/jsx-wrap-multilines': [
      'error',
      {
        declaration: 'parens-new-line',
        assignment: 'parens-new-line',
        return: 'parens-new-line',
        arrow: 'parens-new-line',
        condition: 'parens-new-line',
        logical: 'parens-new-line',
        prop: 'parens-new-line',
      },
    ],
    'import/no-unresolved': 'error',
    'import/order': [
      'error',
      {
        groups: [
          'builtin', // Built-in imports (come from NodeJS native) go first
          'external', // <- External imports
          'internal', // <- Absolute imports
          ['sibling', 'parent'], // <- Relative imports, the sibling and parent types they can be mingled together
          'index', // <- index imports
          'unknown', // <- everything else I guess
        ],
        'newlines-between': 'always',
        alphabetize: {
          order: 'asc',
          caseInsensitive: true,
        },
      },
    ],
    'check-file/filename-naming-convention': [
      'error',
      {
        '**/*.{ts,tsx,js,jsx,json}': '+([a-z])*([-a-z0-9])*(.+([a-z0-9]))',
      },
    ],
    'check-file/folder-naming-convention': [
      'error',
      {
        '**/': '+([a-z])*([-a-z0-9])*(.+([a-z0-9]))',
      },
    ],
    'check-file/filename-blocklist': [
      'error',
      {
        '**/*.story.tsx': '*.stories.tsx',
        '**/*.util.ts': '*.utils.ts',
        '**/*.style.tsx': '*.styles.tsx',
      },
    ],
  },
};