Skip to content

longo-andrea/vue-component-template

Repository files navigation

🛕 Vue Component Template

Vue3 + Vite + TypeScript + Vitest + Vitepress + Storybook + ESLint + Prettier

Basic Vue3 component library template.

⚡️ Faster builds with Vite bundler

⚒️ TypeScript support

🧪 Faster tests with Vitest and Vue Test Utils

👗 Pretty and uniform code with ESLint and Prettier

📚 Easy library documentation with VitePress framework

📃 Comprehensive playgrounds and tests with Storybook

Getting Started

Usage

// Clone the template
git clone https://github.com/longo-andrea/vue-component-template#readme

// Install dependencies
pnpm i

Configuration

After have clonet this template, update with your info:

  • Properties: author, name in package.json
  • Update package name in vite.config.ts
  • Update LICENCE.md
  • Clean up the README.md

Examples

Develop your on components, then in the client application.

// Install the libray
pnpm i vue-component-template (use your package name here)

Apply your global styles, in main.ts:

import { createApp } from 'vue'
import App from './App.vue'
import 'vue-component-template/index.css' // <- Global styling

createApp(App).mount('#app')

Then import components when needed:

<script setup lang="ts">
import { ComponentA } from 'vue-component-template';

// ... your custom login
</script>

...