An import sort style based on import-sort-style-module that support extra groupings by path prefix.
Install this package through npm:
npm install --save-dev import-sort-style-module-and-prefixor yarn:
yarn add -D import-sort-style-module-and-prefixIn your package.json or .importsortrc, specify module-and-prefix as the style for file groups which you want to use this style.
For example, in package.json:
"importSort": {
".js, .jsx, .ts, .tsx": {
"style": "module-and-prefix"
}
}This module works exactly the same as import-sort-style-module if no extra configuration is done.
The configuration either lies under the key importSortPrefix in your package.json, in a file named .importSortPrefixrc. Thanks to cosmiconfig, .importSortPrefixrc can be of JSON or YAML format. Format can be explicited specified by the file extension. Please refer to cosmiconfig for further information.
- Groups all imports with path matching the prefix
src/, and places them above the imports with relative path.
{ "groupings": ["src/"] }- Groups all imports with path matching the prefix
src/orcomponents/together, and those matching the prefixlib/in another group.
{ "groupings": [["src/", "components/"], "lib/"] }There are two options available:
position- Accepted values:beforeAbsolute,beforeBuiltins,beforeRelative,afterRelative. Default:beforeRelativegroupings- Array of [string or array of string](string | string[])[]. Default:[]
If not specified, the default value beforeRelative is used.
To illustrate each value, let's consider the following examples adapted from import-sort-style-module, and assume we have a custom group for modules matching the path prefix src/.
beforeAbsolute
/*******************************************
*
* Absolute module without assigned imports
*
*******************************************/
import "src";
import "src/some_module";
import "src/helpers/some_helper";
// Absolute modules with side effects (not sorted because order may matter)
import "a";
import "c";
import "b";
// Relative modules with side effects (not sorted because order may matter)
import "./a";
import "./c";
import "./b";
// Modules from the Node.js "standard" library sorted by name
import {readFile, writeFile} from "fs";
import * as path from "path";
/*******************************************
*
* Ordinary absolute module imports
*
*******************************************/
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "src/helpers/some_helper";
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";beforeBuiltins
/*******************************************
*
* Absolute module without assigned imports
*
******************************************/
import "src";
import "src/some_module";
import "src/helpers/some_helper";
// Absolute modules with side effects (not sorted because order may matter)
import "a";
import "c";
import "b";
// Relative modules with side effects (not sorted because order may matter)
import "./a";
import "./c";
import "./b";
/*******************************************
*
* Ordinary absolute module imports
*
******************************************/
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "src/helpers/some_helper";
// Modules from the Node.js "standard" library sorted by name
import {readFile, writeFile} from "fs";
import * as path from "path";
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";beforeRelative (default)
// Absolute modules with side effects (not sorted because order may matter)
import "a";
import "c";
import "b";
/*******************************************
*
* Absolute module without assigned imports
*
******************************************/
import "src";
import "src/some_module";
import "src/helpers/some_helper";
// Relative modules with side effects (not sorted because order may matter)
import "./a";
import "./c";
import "./b";
// Modules from the Node.js "standard" library sorted by name
import {readFile, writeFile} from "fs";
import * as path from "path";
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
/*******************************************
*
* Ordinary absolute module imports
*
******************************************/
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "src/helpers/some_helper";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";afterRelative
// Absolute modules with side effects (not sorted because order may matter)
import "a";
import "c";
import "b";
// Relative modules with side effects (not sorted because order may matter)
import "./a";
import "./c";
import "./b";
/*******************************************
*
* Absolute module without assigned imports
*
******************************************/
import "src";
import "src/some_module";
import "src/helpers/some_helper";
// Modules from the Node.js "standard" library sorted by name
import {readFile, writeFile} from "fs";
import * as path from "path";
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";
/*******************************************
*
* Ordinary absolute module imports
*
******************************************/
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "src/helpers/some_helper";This option defines custom groupings and accepts an array. Each array item can either be a path prefix, or an array of path prefixes.
If not specified, the default value [] is assumed. In such case, this style works exactly the same as import-sort-style-module.
Each item in the groupings array corrisponds to one group, i.e. a chunk of import statements that does not contain any empty line.
To group multiple path prefixes into one group, place them in an array. Refer to Example 2 for an example.
The custom groups will appear in the same order as specified in the option.
Options:
{ "groupings": ["src/", "@helpers/", "@components/", "lib/"] }Imports matching each of the specified path prefix will be grouped into their corrisponding group.
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
/** Custom import groups */
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "@helpers/some_helper";
import ExternalLib, {libHelperFunc} from "lib/external_lib";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";Take note that the src/ group appears before the @helpers/ group, in the same order as the groupings option, regardless of alphabetical order. lib/ group comes after @helpers/ group, the two groups separated by exactly one empty line, unaffected by the empty @components/ group.
Options:
{ "groupings": [["src/", "@helpers/"], "@components/", "lib/"] }Imports matching each of the specified path prefix group will be grouped into their corrisponding group. In other words, imports matching the path prefixes src/ or @helpers/ are grouped together, with the ones matching src/ come before those matching @helpers/; imports matching lib/ are in their own group.
// Third-party modules sorted by name
import aa from "aa";
import bb from "bb";
import cc from "cc";
/** Custom import groups */
import indexModule from "src";
import {namedExport} from "src/some_module";
import helperFunc from "@helpers/some_helper";
import ExternalLib, {libHelperFunc} from "lib/external_lib";
// First-party modules sorted by "relative depth" and then by name
import aaa from "../../aaa";
import bbb from "../../bbb";
import aaaa from "../aaaa";
import bbbb from "../bbbb";
import aaaaa from "./aaaaa";
import bbbbb from "./bbbbb";Released under the MIT License. ©️ 2020 Ron Lau.