ESLint-plugin-lean-imports
Make sure your imports only import the bits you need. Named imports actually import the entire library. So for example, this imports all of react-bootstrap:
import {Tab} from 'react-bootstrap'
In contrast, the direct import style only imports the specifically imported item:
import Tab from 'react-bootstrap/lib/Tab';
To avoid unnecessary bloating your bundle, this linting rule forbids the use of the named import style above, for the libraries that you specify in the configuration.
Installation
Install ESLint either locally or globally.
npm install eslint
If you installed ESLint
globally, you have to install lean-imports plugin globally too. Otherwise, install it locally.
npm install eslint-plugin-lean-imports
The rules are specifically written to target ES6 JavaScript, so you'll want to use the babel-eslint parser.
Configuration
Add plugins
section and specify ESLint-plugin-lean-imports as a plugin.
{
"parser": "babel-eslint",
"plugins": [
"lean-imports"
]
}
Finally, enable all of the rules that you would like to use.
{
"rules": {
"lean-imports/import": [1, [
"lodash",
"react-bootstrap"
]]
}
}
List of supported rules
The rules prevent from importing the whole library at once.
Here are the supported libraries:
- import Prevent an array of library from being completely imported
Contributing
PRs are welcome if you have ideas.
Just make sure your commit is prefixed by one of the following:
[added]
[changed]
[fixed]
[removed]
For changed or removed, just make sure to add an upgrade path in the commit message.
License
ESLint-plugin-lean-imports is licensed under the MIT License.