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";