搭建 Vue3 项目

Vue3 官方脚手架

基于Vite构建工具的官方脚手架

npm init vue@latest
npm create vue@latest // 等同于 npm init 包名

• 执行过程
  • 补全vue@latest包名create-vue@latest（@latest代表最近的版本）
  • 调用npx下载到内存（本地没有的情况下）
  • 自动执行create-vue来构建项目
• 基于vite构建项目

Vue2 官方脚手架

基于Webpack构建工具的官方脚手架

npm install -g @vue/cli  // 下载脚手架
vue create my-project    // 创建项目

• 基于webpack 构建项目

Vite构建工具

npm create vite@latest // 等同于 npm init vite@latest

• 执行过程
  • 补全vite@latest包名create-vite@latest（@latest代表最近的版本）
  • 调用npx下载到内存（本地没有的情况下）
  • 自动执行 create-vite 来构建项目
• 基于vite 可以构建vue或其他前端框架的不同项目

CDN构建

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

<div id="app">{
  { message }}</div>