prettier-plugin-pretty-imports v0.0.2

prettier-plugin-pretty-imports

Sorted, sectioned imports

Groups and sorts your JavaScript imports when running prettier.

Demo

Before

import React from 'react';
import classNames from 'classnames';
import styles from './Form.scss';
import Button from '@/components/common/Button';
import { arrChunk } from '@/helpers/functions';

After

//------------------------------------------------------------------------------
// Node Modules ----------------------------------------------------------------
import classNames from 'classnames';
import React from 'react';
//------------------------------------------------------------------------------
// Style -----------------------------------------------------------------------
import styles from './Form.scss';
//------------------------------------------------------------------------------
// Components ------------------------------------------------------------------
import Button from '@/components/common/Button';
//------------------------------------------------------------------------------
// Helpers ---------------------------------------------------------------------
import { arrChunk } from '@/helpers/functions';

Install

Install yarn. Then run:

> yarn add -D prettier-plugin-pretty-imports

Prettier should automatically recognize the plugin in your project. Read more about prettier plugins here.