https://github.com/wessouza/import-sort-style-wes

Wes' personal import-sort style
https://github.com/wessouza/import-sort-style-wes

Last synced: 3 months ago
JSON representation

Wes' personal import-sort style

• Host: GitHub
• URL: https://github.com/wessouza/import-sort-style-wes
• Owner: WesSouza
• License: mit
• Created: 2019-12-26T23:06:38.000Z (about 5 years ago)
• Default Branch: main
• Last Pushed: 2023-01-07T13:11:15.000Z (about 2 years ago)
• Last Synced: 2024-09-16T03:19:47.181Z (4 months ago)
• Language: TypeScript
• Size: 536 KB
• Stars: 1
• Watchers: 2
• Forks: 1
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# import-sort-style-wes

Wes' personal style for [import-sort](https://github.com/renke/import-sort).

## Sorting Example

```js

// Modules without members

import '@scoped/module';

import 'first-module';

import 'second-module';

import '~/local-module';

// Installed and scoped modules

import scoped from '@scoped/thing';

import whatever from 'module-a';

import anything from 'module-b';

// Local resolved modules

import exported from '~/project-root-file';

// Siblings and parents

import things from '../grand-parent';

import name from '../parent';

import sibling from './sibling';

```

## Why `~`?

Not all characters can be used at a module path, because of `npm` registry

rules, and file system constraints. `npm` already uses the `@` prefix to scope

organizations and teams.

Inspired by [Parcel](https://parceljs.org), which resolves `~` to the project

source directory by default, I decided to define `~` as the de facto reference

for all of my packages root source directories.

Some projects prefer to have every folder on the project source as its own

resolve alias. I find this bad especially for use cases like this, where one

would need to read the file system to determine if an import is within

`node_modules` or the project's source folder. Given that these can be

configured in a multitude of ways, I decided to not support that at all.

## Usage

These instrutions use [prettier](https://prettier.io), which is my preferred

method of enforcing import sort order.

```sh

# Install prettier-plugin-import-sort

yarn add -D prettier-plugin-import-sort

# Install import-sort-style-wes

yarn add -D import-sort-style-wes

```

Then add on your root `package.json`:

```json

{

  "importSort": {

    ".js, .jsx": {

      "parser": "babylon",

      "style": "wes"

    },

    ".ts, .tsx": {

      "parser": "typescript",

      "style": "wes"

    }

  }

}

```

## Development

I've used [yarn](https://yarnpkg.com/en/), and

[tsdx](https://github.com/jaredpalmer/tsdx), which provides scaffolding for

TypeScript libraries.

```sh

# Install yarn, if you don't have it

curl -o- -L https://yarnpkg.com/install.sh | bash

# Install dependencies

yarn install

# Build upon changes (development mode)

yarn run dev

# Lint code

yarn run lint

# Test code

yarn run test

# Build code

yarn run build

```

## License

MIT, https://wes.dev/LICENSE.txt