Git Product home page Git Product logo

eslint-plugin-import-alias's Introduction

@dword-design/eslint-plugin-import-alias

npm version Linux macOS Windows compatible Build status Coverage status Dependency status Renovate enabled
Open in Gitpod Buy Me a Coffee PayPal Patreon

An ESLint plugin that enforces the use of import aliases. Also supports autofixing.

Aliases are a great thing to make imports more readable and you do not have to change import paths that often when a file path is changed.

import foo from '../../model/sub/foo'
import bar from '../other/bar'

changes to

import foo from '@/model/sub/foo'
import bar from '@/sub/other/bar'

Now what if you are in a bigger team or you have a lot of projects to update. Or you just want to make sure that everything is consistent. This is where a linter comes into the play. This rule allows you to detect inconsistent imports and even autofix them. This works by matching alias paths agains the imports and replacing the import paths with the first matching aliased path.

Install

# npm
$ npm install @dword-design/eslint-plugin-import-alias

# Yarn
$ yarn add @dword-design/eslint-plugin-import-alias

Usage

Add the plugin to your ESLint config:

{
  "extends": [
    "plugin:import-alias/recommended"
  ],
}

Alright, now you have to tell the plugin which aliases to use. In the simplest case, you are already using babel-plugin-module-resolver for your aliases. Your babel config would look something like this:

{
  "plugins": {
    ["module-resolver", {
      "alias": {
        "@": ".",
      },
    }]
  }
}

In this case lucky you, you don't have to do anything else. The plugin should work out of the box.

If you have a special project setup that does not have a babel config in the project path, you can still use the plugin by passing the aliases directly to the rule. In this case you define the rule additionally in the rules section:

Contribute

Are you missing something or want to contribute? Feel free to file an issue or a pull request! ⚙️

Support

Hey, I am Sebastian Landwehr, a freelance web developer, and I love developing web apps and open source packages. If you want to support me so that I can keep packages up to date and build more helpful tools, you can donate here:

Buy Me a Coffee  If you want to send me a one time donation. The coffee is pretty good 😊.
PayPal  Also for one time donations if you like PayPal.
Patreon  Here you can support me regularly, which is great so I can steadily work on projects.

Thanks a lot for your support! ❤️

License

MIT License © Sebastian Landwehr

eslint-plugin-import-alias's People

Contributors

actions-user avatar dword-design avatar renovate-bot avatar renovate[bot] avatar semantic-release-bot avatar test123456789012345 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.