How to Create a Vue Project

There are several ways to create a Vue project. Before that - are you familiar with Vue? It is a JavaScript UI framework that makes building websites a lot easier. React, Svelte and Angular live in the same space, and installing Vue works much the same as installing any of them. Here are the three ways I actually use, from quickest to most complete.

1. Quick prototype with a CDN

For playing around, embedding Vue into an existing page, or a single-file demo, a script tag is all you need:

<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.global.js"></script>

Pin the major version (vue@3) so breaking changes never sneak into your page. If you prefer native ES modules, there is a module build too - note that this snippet belongs inside your HTML, not your markdown:

<script type="module">
  import { createApp } from 'https://cdn.jsdelivr.net/npm/vue@3/dist/vue.esm-browser.js'

  createApp({
    data() {
      return { message: 'Hello Vue!' }
    },
  }).mount('#app')
</script>

You can browse the full npm package on the jsDelivr site.

2. Install with npm

If you already have a build setup (Vite, webpack, whatever) and just want the library itself:

# latest stable
npm install vue

This gives you the framework without any scaffolding - the right choice when Vue is one dependency in a bigger project, not the whole project.

3. Scaffold a full project with create-vue

For a real application you want a proper project: dev server with hot reload, linting, TypeScript support, routing, tests. The official scaffolder is create-vue, which sets all of that up on top of Vite:

npm create vue@latest

You will be stepped through a set of feature prompts - TypeScript, JSX, Vue Router, Pinia, Vitest, ESLint, Prettier - and the tool generates a project with only what you picked. Then:

cd your-project-name
npm install
npm run dev

That last command starts the Vite dev server with hot module replacement - save a file, see the change in the browser instantly. When you are ready to ship, npm run build produces an optimized bundle in dist/, and npm run preview serves that bundle locally so you can check it.

One note on history: older tutorials (including earlier versions of this post) recommend the Vue CLI (npm install -g @vue/cli). The Vue CLI has been retired - create-vue replaced it as the official way to start a project. Same idea, much faster tooling.

Conclusion

Use the CDN when Vue is a small part of an existing page, npm install when it is a dependency in a project you already have, and create-vue when Vue is the project. For anything you plan to grow, I recommend giving it its own project rather than mixing it into another one - future you will find it much easier to maintain.