VUE自学第一天-如何使用node.js脚手架创建本机本地项目

VUE自学第一天-如何使用node.js脚手架创建本机本地项目！

在本节中，我们将介绍如何在本地搭建 Vue 单页应用。创建的项目将使用基于 Vite 的构建设置，并允许我们使用 Vue 的单文件组件 (SFC)。确保你安装了最新版本的 Node.js，并且你的当前工作目录正是打算创建项目的目录。在命令行中运行以下命令 (不要带上 > 符号)：npm create vue@latest

node.js 下载地址是：https://nodejs.org/en。

***************************************************************************

node.js的安装傻瓜式的，一路都是下一步。选择安装到本地硬盘里面就行了，不推荐安到c盘，容易把c盘沾满了。可以考虑安到D,E,F,等其他盘符下面。（推荐是根下面）

上诉指令，这一指令将会安装并执行 create-vue，它是 Vue 官方的项目脚手架工具。你将会看到一些诸如 TypeScript 和测试支持之类的可选功能提示：

✔ Project name: … <your-project-name>✔ 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 / Cypress / Playwright✔ Add ESLint for code quality? … No / Yes✔ Add Prettier for code formatting? … No / YesScaffolding project in ./<your-project-name>...Done.

如果不确定是否要开启某个功能，你可以直接按下回车键选择 No。在项目被创建后，通过以下步骤安装依赖并启动开发服务器

> cd <your-project-name>

> npm install

> npm run dev

这些命令都是有严格顺序的。第一个进入你刚刚创建的本地项目目录里面了。第二个是执行后续的模块安装，第三个是执行启动项目！

你现在应该已经运行起来了你的第一个 Vue 项目！请注意，生成的项目中的示例组件使用的是组合式 API 和 <script setup>，而非选项式 API。下面是一些补充提示：

推荐的 IDE 配置是 Visual Studio Code + Volar 扩展。如果使用其他编辑器，参考 IDE 支持章节。

更多工具细节，包括与后端框架的整合，我们会在工具链指南进行讨论。

要了解构建工具 Vite 更多背后的细节，请查看 Vite 文档。

如果你选择使用 TypeScript，请阅读 TypeScript 使用指南。

当你准备将应用发布到生产环境时，请运行：

> npm run build

此命令会在 ./dist 文件夹中为你的应用创建一个生产环境的构建版本。关于将应用上线生产环境的更多内容，请阅读生产环境部署指南。

 您阅读本篇文章共花了：