2021-12-22
1741
#vue
Anthony Gore
83691
Dec 22, 2021 â‹… 6 min read

Building a Vue 3 component library

Anthony Gore I'm Anthony Gore, a frontend web developer from Sydney, Australia. I curate the weekly Vue.js Developers Newsletter and blog frequently on interesting web development topics.

Recent posts:

RAG vs. Fine Tuning, A LogRocket Article

Fine-tuning vs. RAG: Which AI strategy fits your frontend project?

Compare fine-tuning vs. RAG to design faster, smarter, and more responsive AI-powered frontend experiences.

Ikeh Akinyemi
Jun 16, 2025 â‹… 8 min read
7 Common CSS Navigation Menu Mistakes And How To Fix Them

7 common CSS navigation menu mistakes and how to fix them

Navigation menu errors are common, even for seasoned developers. Learn seven common navigation menu errors and how to solve them using CSS.

Temitope Oyedele
Jun 13, 2025 â‹… 6 min read
Comparing the top 5 React toast libraries

Comparing the top React toast libraries [2025 update]

Compare the top React toast libraries for when it’s more trouble than it’s worth to create your own custom toast components.

Nefe Emadamerho-Atori
Jun 13, 2025 â‹… 16 min read
Comparison between TanStack Start and Next.js — two modern full-stack React frameworks with different architectural approaches.

TanStack Start vs. Next.js: Choosing the right full-stack React framework

TanStack Start vs. Next.js: both are powerful full-stack React frameworks, but they take fundamentally different approaches to architecture, routing, and developer experience. This guide breaks down their core features from SSR and data fetching to TypeScript support and deployment, to help you choose the right tool for your next React project.

Abiola Farounbi
Jun 12, 2025 â‹… 8 min read
View all posts

9 Replies to "Building a Vue 3 component library"

  1. Thanks for sharing, I’ve followed the instructions, but am hitting a “Error: Could not resolve ‘./components’ from src/index.js” when running the `npm run build` command. The ‘/components/’ folder is definitely there.

    If I change the import to “import components from ‘@src/components’ then the build works correctly, however the module then complains, saying “Cannot find module ‘@src/components'” when used as an npm module in a Vue project.

    Any help/advice would be appreciated.

  2. Hello, I am trying to follow your guide. I am encountering an error when trying to build. I have not gotten to publishing yet. It says, “SyntaxError: Cannot use import statement outside a module.” I’ve read some posts suggesting using “type”: “module” but your package.json does not use this. Any advice?

    1. I added type=module to resolve this

      ”’
      {

      “main”: “index.js”,
      “type”: “module”,

      }

  3. Hi Anthony
    Thanks for sharing. This has helped me a lot on something that I currently working
    But I have a problem, I’m working with script setup and because of that I don’t have access to name, inheritAttrs, etc.
    How can I do the iteration through the list of components exported on index.js file?
    For now I added an extra script block where I set the same, but as you can image this is a hackish solution and would like to use on the final product.
    Thanks

  4. this is a really great source. Thanks for this!
    If I want to import the components individually in my project files (ie. import InputText from ‘my-package’) what do I need to do? I tried to add it to the files white-list but no luck

  5. I don’t suppose you could give a little more detail on the vuepress section? I followed the instructions but all I get running the docs server is the 404 page

Leave a Reply