vue3-compact-template

English | 中文

⚡️ A simple and compact vue 3 template with current cutting edge front end technologies.

See the live demo at:

• http://upupming.site/vue3-compact-template/
• http://upupming.site/vue3-compact-template/storybook/

Tech stack

• Framework: Vue 3
• Package manager: pnpm
• Build tool: Vite 2
• State management: Pinia
• Router: Vue Router
• Utility first CSS framework: WindiCSS
• CSS preprocessor: Less
• UI component explorer: Storybook
• Icons: unplugin-icons
• ESLint rule: eslint-config-standard-with-typescript
• Style linting: stylelint standard
• commit convention: husky + commitlint

Development

# Development
pnpm run dev
# Run storybook
pnpm run storybook

Build

pnpm run build
pnpm run build-storybook

After built, the dist folder will contain both the app and storybook build result, you can just serve them using pnpm run serve.

• http://localhost:5000/vue3-compact-template/
• http://localhost:5000/vue3-compact-template/storybook/

Recommendations

• Component library: NaiveUI, arco design, Varlet
• VueUse - collection of useful composition APIs
• @vueuse/head - manipulate document head reactively

References

• https://github.com/antfu/vitesse
• script setup docs