Vue Library Starter

A minimal Vue library starter, built on top of Vite & Vue 3

Table of Contents

TOC

• Vue Library Starter
  • Table of Contents
  • Features
  • Use the Template
    • GitHub Template
    • Clone to local
  • Usage
    • 1、Install dependencies
    • 2、Build a library
    • 3、Build nuxt library
    • 4、Publish to npm
  • License

Features

• Package manager pnpm, safe and fast
• Bundle with the library mode
• Release with semantic-release
• Publish to npm

Use the Template

GitHub Template

create a repo from this template on GitHub

Clone to local

git clone https://github.com/xiaoluoboding/vue-library-starter

cd vue-library-starter

Usage

Building it is as easy as 1, 2, 3.

1、Install dependencies

pnpm install

2、Build a library

Rename all the vue-library-starter to your component name in the file package.json、vite.config.ts, eg: my-component

pnpm run build:lib

3、Build nuxt library

This repository ships a Nuxt module so you can use the library in Nuxt projects.

• Prepare the Nuxt playground and stub the module (handy for local testing)

pnpm run dev:nuxt:prepare

• Run the Nuxt playground to verify everything works

pnpm run dev:nuxt

• Build the Nuxt module artifacts to lib/nuxt

pnpm run build:module

• (Optional) Build all outputs (ESM, UMD, Nuxt) in one go

pnpm run release

Use in a Nuxt app by adding the module and CSS in your nuxt.config.ts:

export default defineNuxtConfig({
  modules: ['vue-library-starter/nuxt'],
  css: ['vue-library-starter/style.css']
})

4、Publish to npm

npm publish

License

MIT @xiaoluoboding