Vue 2 Final Boilerplate

Vue 2 can be better, even perfect.

Tech Stack

• Framework: Vue 2.6 & @vue/composition-api & vue2-script-setup
• Language: TypeScript
• IDE/LSP: Volar or Vim coc-volar
• Tools: vue-cli & vite by vue-cli-plugin-vite
• Lint: use latest eslint-plugin-vue with Vue 2 (Some Vue 3 style rules lile deprecated-filter/v-slot)

Why

• Vue 2 for legacy browsers and old projects.
• TypeScript play well with Vue 2 if you use defineComponent or script setup with composition-api.
• Volar make perfect IDE support for Vue with full LSP features.
• vite is fast for development and vue-cli for bundling webapp.

Usage

Project setup

yarn

Compiles and hot-reloads for development

yarn dev
yarn vite

Compiles and minifies for production

yarn build
yarn vite:build(just experimental)

Run your unit tests

yarn test:unit

Lints and fixes files

yarn lint

Different with vue-cli

• support vite
• typescript and composition-api first(with script setup)
• use latest eslint-vue-plugin and Vue 3 compat
• supoort more env(development/staging/test/production and so on)

TODO

• composables dir
• auto-routing(maybe unplugin-vue2-auto-routing)
• tailwind/windicss
• tsdoc
• micro-frontend
• stylelint

Links

• vue-cli-plugin-vite