# import/default

> Require a default import to match a default export in the imported file

`import save from "./storage"` asks for the default export of `./storage`. If that file only has named exports, the import fails when the module loads, or a bundler gives you `undefined`. The usual cause is missing braces.

The rule reads the imported file. It doesn't report anything if the file can't be found, or if it has no `import` or `export` at all, like a CommonJS module.

It reads JavaScript and TypeScript files, including JSX. With an ESLint config it only reads `.js`, `.mjs` and `.cjs` files, unless `settings["import/extensions"]` lists others.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"import/default" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* file "storage.js" */}
```js
export function save(item) {
  localStorage.setItem(item.id, JSON.stringify(item));
}
```

{/* bad */}
```js
import save from "./storage.js";

save({ id: "draft" });
```

Not reported:

{/* file "storage.js" */}
```js
export function save(item) {
  localStorage.setItem(item.id, JSON.stringify(item));
}
```

{/* good */}
```js
import { save } from "./storage.js";

save({ id: "draft" });
```

{/* file "storage.js" */}
```js
export default function save(item) {
  localStorage.setItem(item.id, JSON.stringify(item));
}
```

{/* good */}
```js
import save from "./storage.js";

save({ id: "draft" });
```
