codemod-add-import-extensions
A codemod to automatically add file extensions to relative imports in your TypeScript project.
import x from "../x";
import x from "../x.ts";
Usage
Run with npx, passing the path to your project's tsconfig.json
as an argument:
npx codemod-add-import-extensions --tsconfig tsconfig.json
By default, all TypeScript files will be updated in place. If you'd prefer to see what would change, use the --dry-run
flag.
If your tsconfig.json
specifies allowImportingTsExtensions
or rewriteRelativeImportExtensions
, TypeScript extensions like .ts
will be used. Otherwise, they'll be transformed to their .js
equivalents.
Limitations
- Only ESM modules are supported, not CommonJS (
require("../x")
).
- Only static imports are supported, not dynamic ones (
import("../x")
).
- Import aliases are not supported (
import x from "@my-alias/x"
).
- If there are multiple files that could potentially match, the codemod emits a warning rather than trying to resolve the ambiguity.
Why use explicit file extensions?
Preventing regressions
Once you've added file extensions to all of your relative imports, consider enabling the import/extensions
rule from eslint-plugin-import or eslint-plugin-import-x to ensure that they're used consistently going forward.