vue3.0 使用vite构建V3版本项目

Posted 2023-04-23

参考技术A 准备工作：安装node.js

1.选择项目安装地址，例如：D:\test\v3  在v3文件夹中

2.打开终端，输入npm init vite-app <项目名称>

3.项目初始化完成，看到

在终端中输入 cd 项目名，进入你项目中发现缺少 node_modules（依赖包）

输入 npm install

4.依赖包安装成功，执行 npm run dev 即可运行项目啦

5.打包项目，执行 npm build

Vite+Vue3+Vant快速构建项目

参考技术A

随着 Vue3 和 Vite 版本的不断更新完善，开发体验有了质的飞跃。因此，越来越多的大厂也逐步拥抱 Vue3 。
利用 Vite 脚手架工具可以很轻松生成以 Vue3 为模板的项目，但是作为 Vue 全家桶的 vue-router 、 vuex 、 axios 等成员，需要自己一个一个去配置。于是便自行开发了本文讲到的 tive-cli 脚手架模板工具，只需短短几个命令便能快速生成配置健全的 Vue3全家桶 项目，并且集成了 VantUI ，内置了 rem 移动端适配，真正做到了 开箱即用 。

执行次命令后，会出现命令行交互式选择，可使用上（ ↑ ）下（ ↓ ）箭头进行选择，如下：

提示： 该脚手架内置了 Vue2.0 和 Vue3.0 两个版本所对应的 Vue全家桶 模板，可根据项目需要自行选择。

回车（ enter ）确认后，会输出：

接下来就可以按照提示的命令进行操作：

不出意外项目就成功启动了。

欢迎访问： 天问博客