vuetoy3

vuetoy3 is a minimalistic boilerplate for quickly building web prototypes using Vue 3 without any build tool or development server.

• to run the app, just double-click index.html (no dev server)
• to make changes, just edit script.js (no build tool)

GitHub Repositoryhttps://github.com/dtinth/vuetoy3

Use case

This is ideal for building small side-projects, where you:

• want to use Vue 3 and its Composition API
• want multiple routes (it comes with Vue Router)
• prefer not to use any build tool
• don't need to support older browsers
• want IntelliSense in your editor (it comes with a typings file)

Defining components

Components and templates are defined in the JavaScript file. The html template tag makes GitHub highlight the template using HTML grammar (see example), and makes Prettier able to format the template as HTML.

app.component('MyCounter', {
  setup() {
    return { count: Vue.ref(0) }
  },
  template: html`
    <button @click="count--">[-]</button>
    
    <button @click="count++">[+]</button>
  `
})

History

• September 2019 — I created the vuetoy project.
• August 2020 — I created the vuetoy3 project after using vuetoy in various projects.
• September 2020 — Vue 3 stable is released, vuetoy3 is updated to use it.