Import Statement regex

Matches JavaScript/TypeScript import statements.

/import\s+(?:\{[^}]+\}|\w+)\s+from\s+['"]([^'"]+)['"]/g

What it matches

An ES module import with either a braced named list or a single default binding, the from keyword, and a quoted module specifier. The specifier is the capture group, which is the useful part when you are auditing what a file depends on.

Railroad diagram

Read left to right. Every path through the diagram is a string the pattern accepts.

Drag to pan. Ctrl+scroll to zoom.

Breakdown

gFind all matches instead of stopping after the first

iLiteral "i"

mLiteral "m"

pLiteral "p"

oLiteral "o"

rLiteral "r"

tLiteral "t"

\s+Whitespace, one or more

\{Literal "{"

[^}]+Match not one of: Literal "}", one or more

\}Literal "}"

\w+Alternative 2

\s+Whitespace, one or more

fLiteral "f"

rLiteral "r"

oLiteral "o"

mLiteral "m"

\s+Whitespace, one or more

['"]Match one of: Literal "'", Literal """

[^'"]+Match not one of: Literal "'", Literal """, one or more

['"]Match one of: Literal "'", Literal """

Test cases

Matches

import { useState } from 'react'
import App from './App'
import x from "y"

Does not match

const x = require('y')
import './side-effect'

Caveats

It misses several real forms: side-effect imports with no from clause, namespace imports using * as, mixed default-and-named imports, and dynamic import() calls. A commented-out import matches too, since the pattern has no idea what a comment is.

Test this against your own input in the regex tester, browse the full pattern library, or check the syntax cheat sheet.