import-js / import-js/eslint-plugin-import

Problems with ```alphabetize``` order rules in Angular 11x

Open
#2,896 3 comments 0 reactions 0 assignees View on GitHub
import/export ordering
Dominant language
JavaScript
Stars
5.9k
Forks
1.5k
PR merge metrics
No merged PRs in 30d

Description

My team and I are having a strange problem with the paths, for me the import must follow one order and for the rest of the team another, and it is only for me that the order is different.

**This is my problem:**

```
import { TableOrderComponent } from "src/app/shared/tables/table-order/table-order.cmponent";

import { TableOrderDetailsComponent } from "src/app/shared/tables/table-order-details/table-order-details.cmponent";
```

It asks me to change the order, passing TableOrderDetails above TableOrder, but my colleagues say the "correct" order is the one in the code above.

**TSCONFIG:**
```
{
"compilerOptions": {
"target": "es2019",
"module": "es2020",
"strict" false,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true,
"declaration": false,
"sourceMap": true,
"outDir": "./dist/out-tsc",
"baseUrl": "./"
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"noImplicitAny": false,
"typeRoots": ["node_modules/@types"],
"lib": ["es2019", "dom"]
},
"angularCompileOptions": {
"enableI18nLegacyMessageIdFormat": false,
"fullTemplateTypeCheck": false,
"strictInjectionParameters": false
}
}
```

**ESLINT:**
```
{
root: true,
overrides: [
files: ["src/**/*.ts"],
parseOptions: {
project: ["tsconfig.json", "e2e/tsconfig.json"],
tsconfigRootDir: __dirname,
sourceType: "module",
createDefaultProgram: true
},
extends: [
"plugin:@angular-eslint/recommended",
"plugin:@angular-eslint/template/process-inline-templates",
"airbnb-base",
"airbnb-typescript/base",
"eslint:recommended",
"plugin:@typescript-eslint/eslint-recommended",
"plugin:prettier/recommended"
],
plugins: ["@typescript-eslint", "prettier", "ununsed-imports", "simple-import-sort"],
rules: {
...,
"import/order": [
"error",
{
"newlins-between": "never",
alphabetize: {
caseInsensitive: true,
order: "asc"
},
groups: [
"internal",
"unknown",
"external",
"builtin",
["parent", "sibling", "index"]
],
pathGroupsExcludedImportTypes: ["builtin", "type", "object"]
}
]
}
]
}
```

**LIBS:**
```
@angular/common: ~11.2.14
@angular/compiler: ~11.2.14
@angular/core: ~11.2.14
@angular-devkit/build-angular: ~0.1102.13
@angular-eslint/builder: 4.3.1
@angular-eslint/eslint-plugin: 4.3.1
@angular-eslint/eslint-plugin-template: 4.3.1
@angular-eslint/schematics: 4.3.1
@angular-eslint/template-parser: 4.3.1
@angular-eslint/cli: ~11.2.14
@angular-eslint/compiler-cli: ~11.2.14
eslint: ^7.6.0
eslint-plugin-angular: ^4.1.0
eslint-plugin-import: ^2.25.2
eslint-plugin-simple-import-sort: ^10.0.0
eslint-plugin-unused-imports: ^3.0.0
ts-node: ~8.3.0
typescript: ~4.1.5
```

Contributor guide

Open the contributing guide

Research direction

Reproduce the reported import ordering with the two TableOrder imports, the shown ESLint alphabetize configuration, and the listed Angular 11 and TypeScript dependencies. Compare the expected and reported orders, then document or test the conditions that make alphabetization differ; done means the behavior is reproducible and its expected ordering is established.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, javascript, typescript
Domain
tooling
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.