A replacement for the [`eslint-plugin-import/no-duplicates`](https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/no-duplicates.md) rule that includes an option to take into account the imported module name when considering duplicates.
npm install eslint-plugin-import-no-duplicates-prefix-resolved-pathA replacement for the eslint-plugin-import/no-duplicates rule that includes an option to take into account the imported module name when considering duplicates.
Include this plugin in your eslint config:
``js`
{
// ...other config
plugins: [
// ...other plugins
'import-no-duplicates-prefix-resolved-path'
],
// ...other config
}
Disable the eslint-plugin-import/no-duplicates rule and enable this one:
`js`
{
// ...other config
rules: {
// ...other rules
'import/no-duplicates': 0,
'import-no-duplicates-prefix-resolved-path/no-duplicates': [
'error',
{
prefixResolvedPathWithImportName: true,
},
],
// ...other rules
},
// ...other config
}
The options for this rule are the same as eslint-plugin-import/no-duplicates with the added prefixResolvedPathWithImportName option.
Default options:
`js`
{
considerQueryString: false,
'prefer-inline': false,
prefixResolvedPathWithImportName: false // must be set to true to enable
}
The eslint-plugin-import/no-duplicates rule is a problem for projects that import modules from libraries that declare multiple modules in a single typescript declaration file. For example @sveltejs/kit declares several $app/ modules in a single ambient.d.ts file.
This results in a duplicate import error when importing from multiple $app/ modules. For example:
`js`
import { page, getStores } from '$app/stores';
import { goto } from '$app/navigation';
Results in the error:
`sh`
1:34 error '/path/to/project/node_modules/@sveltejs/kit/types/ambient.d.ts' imported multiple times import/no-duplicates
2:23 error '/path/to/project/node_modules/@sveltejs/kit/types/ambient.d.ts' imported multiple times import/no-duplicates
This modified rule includes the module name in the resolved import path to differentiate between modules that resolve to the same file.
In this case the resolved path for both imports would instead be:
``
$app/stores:/path/to/project/node_modules/@sveltejs/kit/types/ambient.d.ts
and
``
$app/navigation:/path/to/project/node_modules/@sveltejs/kit/types/ambient.d.ts
This removes the duplicate import error and still allows for auto fixes when there are actual duplicates.
For example:
`js`
import { page } from '$app/stores';
import { getStores } from '$app/stores';
import { goto } from '$app/navigation';
Will still be auto fixed to:
`js``
import { page, getStores } from '$app/stores';
import { goto } from '$app/navigation';
There are a lot of possible solutions for this issue, this is just one of them. Follow the issue on the repo here.