VUE CLI - 使用VUE脚手架创建前端项目工程
前言
前端从这里开始，本文将介绍如何使用VUE脚手架创建前端工程项目
1.预准备（编辑器和管理器）
- 编辑器：推荐使用Vscode，WebStorm，或者Hbuilder（适合刚开始练手使用），个人感觉上面这些编辑器都比较方便~看个人习惯吧，我使用的是WebStorm（需要破解）。
- Node.JS：Vue 脚手架是基于 Node.js 的环境来运行的，它需要 Node.js 提供的运行时环境和包管理工具 npm 来进行项目的创建、依赖安装等操作。下载地址：Node.js 中文网
- 包管理工具npm：随 Node.js 一起安装，无需额外操作。它是 JavaScript 的默认包管理工具，能方便地安装、更新和卸载 Vue 脚手架以及项目所需的各类依赖包。使用上相对简单直接，对于一般的 Vue 项目开发完全能够满足需求。当然如果你习惯Yarn，也可以使用Yarn代替。
2.安装VUE脚手架
在Windows系统终端中，输入如下命令，进行脚手架的安装：
npm install -g @vue/cli
// 如果需要更换npm的下载源，可以先使用以下命令进行换源
npm config set registry https://registry.npmmirror.com // 换为淘宝源
npm config get registry // 查看淘宝镜像
使用 Vue -V，查看VUE脚手架是否安装成功，显示版本信息
3.使用脚手架创建VUE工程
在你的工程目录下，使用 vue create 【项目名】创建工程 ，需要注意项目名不能有大写字母。
接着界面提示你选择一个预设配置（preset），主要有以下选项：
- Default ([Vue 3] babel, eslint)：使用 Vue 3 的默认配置，包含 Babel 和 ESLint。
- Default ([Vue 2] babel, eslint)：使用 Vue 2 的默认配置，包含 Babel 和 ESLint。
- Manually select features：手动选择功能，可以自定义项目配置。
选择第三个自定义选项，回车。接着出现下面的选项，分别代表：
- Babel：JavaScript 编译工具，用于将 ES6+ 代码转换为向后兼容的 JavaScript 版本。
- TypeScript：一种静态类型检查语言，编译为 JavaScript。
- Progressive Web App (PWA) Support：为项目添加 PWA 支持，使网页应用可以像原生应用一样工作。
- Router：Vue 的官方路由管理器，用于构建单页应用（SPA）。
- Vuex：Vue 的状态管理库，用于管理应用的状态。（不过现在一般使用Pinia~）
- CSS Pre-processors：CSS 预处理器（如 Sass、Less 等）。
- Linter / Formatter：代码检查和格式化工具，用于保持代码风格一致。
- Unit Testing：单元测试工具，用于测试代码的各个部分。
- E2E Testing：端到端测试工具，用于测试整个应用流程。
依据你的项目需要选择需要的部分，使用键盘上的 空格键 选择或取消选择功能。按 A 可以全选所有功能。 选择完之后，直接回车。
选择你的VUE版本，是VUE2还是VUE3
接着会跳出几个问题，是否使用类组件语法，是否使用TS语言，是否启用路由的历史模式（history mode），使 URL 更美观（去掉 #）。最后选择错误检查和代码风格规范，如果你希望代码自动格式化且减少风格争议，建议选择 ESLint + Prettier。
