willhoney7 / eslint-plugin-import-helpers

ESLint plugin to help enforce a configurable order for import statements
288 stars 17 forks source link

How can I set order for import './index.styl' #35

Open lupenq opened 3 years ago

lupenq commented 3 years ago

I know that the documentation has a clause about such imports, but can there still be some way? I just want the style imports to always be at the bottom of everyone else

ex. imports:

import React, { useState } from 'react'
import { Image } from 'react-native'
import { observer, useDidUpdate } from 'startupjs'
import PropTypes from 'prop-types'
import randomcolor from 'randomcolor'
import Div from './../Div'
import Span from '../typography/Span'
import './index.styl'

my config:

    "import-helpers/order-imports": [
            "warn",
              { 
                "newlinesBetween": "ignore",
                "groups": [
                    "/^react$/",
                    "/react-native/",
                    "/^react.*/",
                    "/^startupjs/", 
                    "/^@?startupjs.*/",
                    "/^@?dmapper.*/",
                    "module",
                    "/components/",
                    ["/helpers/", "/hooks/"],
                    ["sibling", "parent"],
                    "/.\/index.styl/"
                ]
              }
        ]
lupenq commented 3 years ago

@Tibfib

willhoney7 commented 3 years ago

Hi @lupenq,

There is currently no way to do this. The library specifically ignores bare imports. Support could be added, but it would need to be an option, preferably a per-group option. I'm open to PRs to add the functionality.

Thanks!

PezCoder commented 3 years ago

Hey @Tibfib, Great plugin first of all. After a ton of research & playing with a lot of eslint plugins for sorting imports, this comes really close to what I was looking for. I'm trying to migrate away from the sort-imports by visual studio.

I'm having a similar use case where it's quite common for these style imports to be at the bottom of all the imports as a separate group like @lupenq mentioned in this issue. (Also related https://github.com/Tibfib/eslint-plugin-import-helpers/issues/24)

I don't mind raising a PR for this, Can you help guide me in the right direction on the expectation & how can I get started with this project?

I've never worked on an eslint plugin before but I'm well aware of the JS ecosystem & have played with the usages of this particular plugin with different regex.

hyoretsu commented 3 years ago

This would be pretty neat