vue3的项目目录和关键文件
注意换插件 vue2的是 Vetur ；vue3的是volar
这里注意volar插件已更名为Vue - Official
- vite.config.js
放跟vite配置相关的内容
区别于vue2；vue2是vue.config.js；vue2是基于webpack的，vue3是基于vite的
- main.js
import { createApp } from 'vue'
import App from './App.vue' —— 导入单文件组件
createApp(App).mount('#app') —— 创建实例，并将这个实例往id="app"上挂载
—— createApp(App)并且基于它去创建了一个实例
—— mount('#app')mount设置挂载点，#app页面中id为app的盒子
vue2
new Vue({ render (createElement) {
return createElement(App)
}).$mount('#app')
- App.vue
vue2还需要组件注册
到了vue3这里就不需要，可以直接使用
而且template里允许有多个根元素，不再要求唯一根元素
scoped使得样式只在当前组件内起作用
- package.json
依赖项变成了vue和vite
