Auto imports in Next.js as Nuxt Vue JS Framework

[kristiyan-velkov]

Goals

1. Auto import of the files
2. No more missing imports
3. Easy to work and access your files everywhere in Next.js APP

Non-Goals

Background

Hi,

I’m Kristiyan Velkov, and I’m passionate about Next.js. With over 10 years of experience in JavaScript and open-source development, I’ve worked extensively with React.js, Angular, and Vue.js. This has given me a unique perspective to compare the implementations of these frameworks and suggest potential improvements.

One feature I admire in Nuxt.js is its auto-import functionality. It would be fantastic to see a similar feature integrated into Next.js, enhancing its developer experience.

In my development environment, I rely heavily on several VS Code extensions that streamline my workflow, including:

Next.js CLI: This extension accelerates the development of Next.js applications by automating the creation of common file types such as pages, layouts, and more.
React 18 Snippets: Provides useful snippets for React 18, making it easier to work with functional components and hooks.
Next.js File Generator: A tool designed to automate the creation of various Next.js file types, helping developers set up new routes and components quickly.
Next CLI TURBO: A powerful CLI tool for generating Next.js files directly from the terminal, enhancing productivity.
Additionally, I have contributed to several open-source projects that focus on improving JavaScript tools and libraries. Some of my notable projects include:

more_well: An npm package designed to enhance JavaScript development.
You can also find my writings on Medium, where I share insights and tutorials on various web development topics:

Kristiyan Velkov on Medium
JavaScript is evolving rapidly, and I’m excited to see how Next.js continues to grow and innovate.

Best regards,
Kristiyan Velkov

Proposal

Implement an auto-import feature similar to what the Nuxt.js team has developed. This feature would automatically import components, utilities, and other modules as they are used, eliminating the need for manual imports and significantly improving development efficiency. Integrating this functionality into Next.js would streamline the coding process, reduce boilerplate code, and enhance the overall developer experience.

[rafikkasmi]

Just commenting to second this and support this feature, the dev experience it provides in nuxt is just out of this world , really hope for something similar in the next ecosystem

[voltuer]

as far as i'm aware, Nuxt just uses unimport