Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Auto import of customized component name

Open
#439 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
nuxtjs, typescript
Domain
frontend

Research direction

Start with the componentName setting in nuxt.config.ts and reproduce the NuxtIcon usage shown in the issue with the listed package versions. Trace how the customized component name is handled for auto-imports, then verify that is registered or that the supported explicit-import configuration is documented.

Written by the indexing model from the issue text.

Description

I have customized component name in nuxt.config.ts as mentioned here:
https://nuxt.com/modules/icon

icon: {
    componentName: 'NuxtIcon'
},

However use of component doesn't seem to register auto import of the component:

<NuxtIcon name="lucide:newspaper" />
"@iconify-json/lucide": "^1.2.71",
"@nuxt/icon": "^2.1.0",
"nuxt": "^3.12.1",
"vue": "^3.3.8",

I already have another custom component Icon used for something else.

Anything else I neeed to configure or can I explicit import the component?

Dominant language
TypeScript
Stars
1.2k
Forks
97
Avg merge
4d 20m
Merged PRs (30d)
12

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from nuxt/icon

All issues in nuxt/icon

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.