CODEWITHSUNDEEP
reactjsimporteslintes6-modules
Luis Febro
Luis Febro

Reputation: 1850

How to fix import/no-named-as-default ESlint rule when you want to change the name of a default import?

I have the following warning from ESlint import plugin:

eslint - import/no-named-as-default: use default import syntax to import clearRegister.

import { default as clearRegister } from "./utils/form/clearForm";

Here I am using default as to rename my default imported function to clearRegister. This renaming works as a charm.

//clearForm.js
export default function clearForm() {
 ...
}

How can I fix this warning?

Upvotes: 5

Views: 6779

Answers (2)

Claim
Claim

Reputation: 921

Sometimes when adding a default export I used to forget to remove the export keyword from the component declaration.

export const SplitMethods = ({...}) => ...

export default SplitMethods;

This would result in enter image description here

Removing export solves this eslint error.

Upvotes: 0

Shahaed
Shahaed

Reputation: 460

// Invalid
import { default as clearRegister } from "./utils/form/clearForm";

// Valid
import clearForm from "./utils/form/clearForm";

Check here: https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/no-named-as-default.md

Upvotes: 3

Related Questions