创建vue3项目（vite）

一、vue3和vue2

1.创建vue2项目：基于构建工具webpack
        vue create 项目名称

        基于webpack的项目有一个问题，就是编译速度慢

        解决：使用vite

        vite优势：在开发过程中大大提升我们的效率

2.创建vue3项目：基于vite

        npm init @vite/app 项目名称  /  npm create vite@latest 项目名称 --template vue
        选择vue（默认版本是vue3）

        2.1 vite+vue3的方式

                把create创建的vue3的src整个复制粘贴到基于vite的项目中

                把create创建的package.json中的 "dependencies"整个复制替换 vite中的 

                 npm i：安装依赖

                npm run dev 启动修改错误

        2.2 vite+vue2的方式 

                把create创建的vue2的src整个复制粘贴到基于vite的项目中

                 把create创建的package.json中的 "dependencies"整个复制替换 vite中的 项目

                 npm i：安装依赖

                 npm install vite-plugin-vue2 -D

                 在vite的config.js中配置：

                         import { createVuePlugin } from 'vite-plugin-vue2'

                        export default {

                                plugins: [ createVuePlugin(/* options */) ],

                        }

                 npm i vue-template-compiler -S

二、vite 

vite官网：Vite中文网

• 什么vite？——新一代前端构建工具
• 优势如下
  • 开发环境中，无需打包操作，可快速的冷启动
  • 轻量快速的热重载（HMR）
  • 真正的按需编译，不再等待整个应用编译完成

 注意：使用vite构建工具构建的vue3项目，将自己创建的项目放在App.vue组件/HelloWorld.vue组件中，不需要注册（使用vue脚手架构建vue3项目需要），只需要导入即可。