Duplicate Imports
ID |
javascript.duplicate_imports |
Severity |
info |
Remediation Complexity |
medium |
Remediation Risk |
low |
Remediation Effort |
medium |
Resource |
Code Smell |
Language |
JavaScript |
Tags |
code-smell, imports |
Description
Reports the second and subsequent import declarations that load the same module within a single source file. ECMAScript modules collapse repeated imports of the same specifier into one runtime resolution, but at the source level they confuse readers and defeat tools that index imports per module.
The rule operates per file (per compilation unit) — cross-file duplication is out of scope. require(…) calls and dynamic import(…) expressions are ignored; only static import declarations are considered.
Rationale
-
A single consolidated import is easier to read at a glance and easier to refactor (one move, one rename).
-
Import organisers and de-duplicators assume one declaration per module — duplicates create churn whenever those tools run.
-
Splitting type-only and value imports across two declarations from the same module (
import {X}; import type {T};) is also collapsible: TypeScript merges them at emit time, and modern bundlers prefer the merged form.
// Bad
import { useState } from "react";
import { useEffect } from "react"; // duplicate — same source as line 1
Remediation
Combine the import declarations:
// Good
import { useEffect, useState } from "react";
Or, when the second import is type-only, use the inline type modifier:
import { type Props, useState } from "react";