import-js/eslint-plugin-import

import/no-duplicates groups incompatible import paths

idleberg opened this issue · 7 comments

idleberg commented

I'm having problems using import/no-duplicates in a Svelte application (not that it is important) that contains the following imports:

import { onMount } from 'svelte'
import { writable } from 'svelte/store'

When running ESLint with the --fix flag, the code will be converted into the following code:

import { onMount, writable } from 'svelte'

And this, of course, will break the application from resolving the module:

"writable" is not exported by node_modules/.pnpm/svelte@4.2.18/node_modules/svelte/src/runtime/index.js"

In addition, this issue doesn't show up in normal lint mode (without --fix), which made it hard to identify the rule causing the issue.

ljharb commented

My suspicion is that you're using TypeScript - if so, what version of TS and the TS eslint import resolver are you using?

idleberg commented

We're on an older ESLint version, but I think we caught the same problem in the (also out-of-date) ESLint 8 version.

{
	"devDependencies": {
		"eslint": "7.32.0",
		"eslint-import-resolver-typescript": "^3.6.3",
		"eslint-plugin-import": "^2.30.0",
		"typescript": "^5.5.4"
	}
}
ljharb commented

eslint 8 is the latest version that everything supports, still, so i'd def suggest updating - but the rest are good.

what's your eslint config look like?

idleberg commented

I tested again with ESLint 8.57.1, we got the same issue

.eslintrc.cjs 
/** @type { import("eslint").Linter.Config } */
module.exports = {
	extends: ['@sveltejs'],
	root: true,
	extends: [
		'plugin:@typescript-eslint/recommended',
		'plugin:jsonc/recommended-with-json',
		'plugin:storybook/recommended',
		'plugin:svelte/recommended',
		"plugin:import/recommended",
	],
	parser: '@typescript-eslint/parser',
	plugins: ['@typescript-eslint'],
	parserOptions: {
		sourceType: 'module',
		ecmaVersion: 2020,
		extraFileExtensions: ['.svelte'],
	},
	settings: {
		/**
		 * Needed in combination with `eslint-import-resolver-typescript` to enforce `import/extensions` rule.
		 * @see {@link https://github.com/import-js/eslint-plugin-import/blob/main/README.md#typescript}
		 */
		"import/resolver": {
			"typescript": true,
			"node": true,
		},
	},
	env: {
		browser: true,
		es2017: true,
		node: true,
	},
	overrides: [
		{
			files: ['*.json'],
			parser: 'jsonc-eslint-parser',
			rules: {
				'jsonc/no-comments': 'off',
			},
		},
		{
			files: ['*.svelte'],
			parser: 'svelte-eslint-parser',
			parserOptions: {
				parser: '@typescript-eslint/parser',
			},
		},
	],
	rules: {
		curly: 'error',
		'svelte/block-lang': [
			'error',
			{
				enforceScriptPresent: true,
				enforceStylePresent: false,
				script: ['ts', null], // a list of languages or null to signify no language specified
				style: 'scss', // same as for script, a single value can be used instead of an array.
			},
		],
		'svelte/button-has-type': [
			'error',
			{
				button: true,
				submit: true,
				reset: true,
			},
		],
		'svelte/no-at-html-tags': 'warn',
		'import/extensions': ['error', 'always', { ignorePackages: true }],
	},
};

I also conducted a superficial test with ESLint 9 and did not observe the problem. However, I don't have much experience with the ESLint configuration migrator and how good its results are.

ljharb commented

Were you able to resolve the issue?

idleberg commented

Were you able to resolve the issue?

I guess this is up for debate. I did not manage to resolve the issue using ESLint 8.x, so we took this as an opportunity to finally upgrade to 9.x. One thing puzzles me though: you mentioned this plugin supports ESLint >=8, but this isn't reflected by the version range specified in peerDependencies – how come?