vite创建Vue2项目

1、初始化(相当于npx create-vite)

npm init vite@latest

2、 输入项目名：vite-vue2
3、选择一个框架：vanilla
4、选择完成之后

cd vite-vue2 && npm install && npm install vite-plugin-vue2 vue-template-compiler -D

5、新建 vite.config.js 文件

// 1. 新建: touch vite.config.js ​
// 2. 打开/编辑 vite.config.js 
 import { createVuePlugin } from 'vite-plugin-vue2'​
 export default {
   plugins: [createVuePlugin()],
 }

6、安装 vue2

由于 vue 仓库主分支默认 vue3.x，所以直接 npm install vue 安装的是最新的 vue3，所以安装 vue2.x 得使用版本号

 npm install vue@2.6.14 -save-dev

7、修改项目结构

1. 创建src文件夹
2. 将 main.js 移入src 文件夹中，并修改：

// main.js
import Vue from "vue";
import App from "./../App.vue"
​
new Vue({
   el: "#app",
   render: (h) => h(App)
}).$mount();

3. 修改 index.html中对 main.js的引用路径：

<script type="module" src="/src/main.js"></script>

4. 在src文件中创建App.vue，并修改：

<template>
  <div>This is Vue2</div>
</template>

5. 启动项目

 npm install && npm run dev