Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6290

How do I configure ESLint to add line spacing between my path aliases?

$
0
0

Right now with my ESLint auto import sorter and ESLint configuration, everything works fine. But I want to add line spacing between my different aliases. Not sure how I can accomplish that.

Right now React imports go on top and all others are grouped together with a space between.

.eslintrc.js

module.exports = {  root: true,  extends: '@react-native-community',  parser: '@typescript-eslint/parser',  plugins: ['@typescript-eslint', 'import'],  overrides: [    {      files: ['*.ts', '*.tsx'],      rules: {'no-undef': 'off','no-shadow': 'off','react/jsx-uses-react': 'off','react/react-in-jsx-scope': 'off','@typescript-eslint/no-shadow': ['error'],'sort-imports': ['error',          { ignoreCase: true, ignoreDeclarationSort: true },        ],'import/order': ['error',          {            groups: [              ['external', 'builtin'],'internal',              ['sibling', 'parent'],'index',            ],            pathGroups: [              {                pattern: '@(react|react-native)',                group: 'external',                position: 'before',              },              {                pattern: '@tests/**',                group: 'internal',              },              {                pattern: '@assets/**',                group: 'internal',              },              {                pattern: '@components/**',                group: 'internal',              },              {                pattern: '@config/**',                group: 'internal',              },              {                pattern: '@constants/**',                group: 'internal',              },              {                pattern: '@hooks/**',                group: 'internal',              },              {                pattern: '@jotai/**',                group: 'internal',              },              {                pattern: '@navigation/**',                group: 'internal',              },              {                pattern: '@routes/**',                group: 'internal',              },              {                pattern: '@screens/**',                group: 'internal',              },              {                pattern: '@theme/**',                group: 'internal',              },              {                pattern: '@types/**',                group: 'internal',              },              {                pattern: '@utils/**',                group: 'internal',              },            ],            pathGroupsExcludedImportTypes: ['internal', 'react'],'newlines-between': 'always',            alphabetize: {              order: 'asc',              caseInsensitive: true,            },          },        ],      },    },  ],};

tsconfig.json

{"extends": "@tsconfig/react-native/tsconfig.json","compilerOptions": {"strict": true,"skipLibCheck": true,"baseUrl": ".","paths": {"@tests/*": ["src/__tests__/*"],"@assets/*": ["src/assets/*"],"@components/*": ["src/components/*"],"@config/*": ["src/config/*"],"@constants/*": ["src/constants/*"],"@hooks/*": ["src/hooks/*"],"@jotai/*": ["src/jotai/*"],"@navigation/*": ["src/navigation/*"],"@routes/*": ["src/routes/*"],"@screens/*": ["src/screens/*"],"@theme/*": ["src/theme/*"],"@app/types/*": ["src/types/*"],"@app/utils/*": ["src/utils/*"]    }  }}

How it currently looks, but want more spacing between the different aliases.Thank you and Merry Christmas!

enter image description here


Viewing all articles
Browse latest Browse all 6290

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>