(create-vue）新旧(vue-cli)脚手架创建 Vue 项目的区别

先看这个表格：

脚手架	vue-cli	create-vue
构建项目		vite
打包代码	webpack	rollup

• 脚手架：创建项目，选择性安装需要的插件，指定统一的风格，生成demo。
• 构建项目：建立项目的运行环境，需要手动安装插件。
• 打包代码：代码写好之后，为了更好的使用，需要打包处理一下。

vue-cli 是 Vue 早期推出的一款脚手架，使用 webpack 创建 Vue 项目，可以选择安装需要的各种插件，比如 Vuex、VueRouter等。vue-cli 用于创建 vue2 的项目； @vue/cli 用于创建 vue3 的项目，当然也支持 vue2。

create-vue 是 Vue3 的专用脚手架，使用 vite 创建 Vue3 的项目，也可以选择安装需要的各种插件，使用更简单。

使用@vue/cli脚手架，创建Vue项目

前提条件：

• Node.js版本必须高于 8
• npm 版本必须高于 8

安装

npm install -g @vue/cli

选择项目要用到的技术

启动

npm run serve

与 create-vue 创建不一样，用@vue/cli在创建中，依赖下载完毕，直接启动就好；

使用create-vue脚手架，创建Vue项目

前提条件：

• Node.js版本必须高于 16
• npm 版本必须高于 6

1、安装并执行 create-vue

npm create vue@latest

确定项目名称、根据项目选择可选功能

2、安装依赖并启动

cd <your-project-name> // 进入创建项目文件
npm install  // 下载依赖
npm run dev // 启动项目

@vue/cli 与 create-vue 的区别

1. 可选功能不太一样，例如：全局状态管理工具，create-vue用的是大菠萝（Pinia），@vue/cli用的是VueX；create-vue还提供了一些测试工具。
2. 打包工具不太一样，create-vue用的是rollup，@vue/cli用的是Webpack；
3. create-vue实际上，使用的是构造工具Vite，提升开发体验。