目录
一、前言
在实际开发中，为了快速满足业务的需求，开发者往往不想投入过多的时间在搭建工程、配置环境上面，于是很多编程语言都逐渐推出合适的工程化项目的脚手架，开发者只需要按照要求输入一些命令即可，对于VUE来说也是如此，本文将通过实际案例详细分享一下VUE3中工程化项目的使用。
二、前置准备
2.1 环境准备
脚手架工具：create-vue，是vue官方提供的最新的脚手架工具，可用于快速生成一个工程化的Vue项目
2.1.1 create-vue功能
create-vue提供了如下功能：
-
统一的目录结构；
-
本地调试；
-
热部署；
-
单元测试；
-
集成打包；
2.1.2 nodejs环境
本地安装nodejs，这个比较简单就不再赘述了，安装完成后，通过下面的窗口命令检查一下
注意：vue3要求的最低nodejs的版本是18.16
2.1.3 配置nodejs的环境变量
使用下面的命令设置一下nodejs环境变量，方便后续执行相关的npm命令
npm config set prefix ""D:\dev-tools\node\place2.1.4 更换安装包的源
设置使用下面的命令
npm config set registry http://registry.npm.taobao.org/检查是否设置成功
npm config get registry三、工程化项目创建与启动过程
3.1 创建工程化项目
创建一个工程化VUE项目，执行下面的命令
npm init vue@latest执行上面的命令之后，将会安装并执行 create-vue ，它是Vue官方的项目脚手架工具，第一次创建项目，先都使用默认的选项即可；
关于创建项目过程中的各个参数项做如下说明：
-
Project name：------》项目名称，默认值：vue-project，可输入想要的项目名称，此处我写的是：vueproject1。
-
Add TypeScript? ------》是否加入TypeScript组件？默认值：No。
-
Add JSX Support? ------》是否加入JSX支持？默认值：No。
-
Add Vue Router for Single Page Application development? ------》是否为单页应用程序开发添加Vue Router路由管理组件？默认值：No。
-
Add Pinia for state managem