1.vue使用vite构建初始化项目

npm create vue@latest

---

❯ npm create vue@latest> npx
> create-vueVue.js - The Progressive JavaScript Framework✔ Project name: … vue3_test
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit Testing? … No / Yes
✔ Add an End-to-End Testing Solution? › No
✔ Add ESLint for code quality? › NoScaffolding project in /home/ying/VueProj/vue3_test...Done. Now run:cd vue3_testnpm installnpm run dev

进入刚刚创建的目录，并安装依赖
2.

cd vue3_test
npm i

---

这个时候，npm安装可能一直在转圈圈，没有显示进度，我们可以通过查看网速状态来观察是否正常下载。

❯ npm iadded 175 packages, and audited 176 packages in 1m45 packages are looking for fundingrun `npm fund` for details8 moderate severity vulnerabilitiesTo address issues that do not require attention, run:npm audit fixTo address all issues possible (including breaking changes), run:npm audit fix --forceSome issues need review, and may require choosing
a different dependency.Run `npm audit` for details.

其他

npm run dev的dev来源

目录结构

index.html
内容多是因为这个main.ts，通过src引入

main.ts里引入了App.vue并挂载到了id为app的标签

进入App.vue发现是由其他组件在这个根组件(App.vue)内"拼接"的

vscode推荐的插件