Node.js 入门

主要参考资料：
nodejs官网: https://nodejs.org/zh-cn
deepseek:使用 Vite 搭建 Vue 3 项目的完整指南

一、什么是 Node.js？

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时环境，让 JavaScript 可以脱离浏览器在服务端运行。它发布于2009年，彻底改变了 JavaScript 只能做网页特效的刻板印象。

主要特点：

• 事件驱动和非阻塞 I/O 模型
• 轻量高效，适合高并发场景
• 统一前后端开发语言（JavaScript）
• 拥有最大的开源生态系统（npm）

二、包管理器 npm

npm（Node Package Manager）是 Node.js 的默认包管理器，全球最大的开源库生态系统，包含超过 200 万个可重用代码包。

# 初始化项目（生成 package.json）
npm init -y

# 安装生产依赖
npm install lodash

# 安装开发依赖
npm install vite --save-dev

# 运行脚本
npm run dev

三、构建工具 Vite

3.1 为什么选择 Vite？

传统工具（如 Webpack）痛点：

• 冷启动慢（需打包所有资源）
• 热更新效率低（全量重载）

Vite 解决方案：

• 基于原生 ES Modules
• 按需编译（启动仅处理入口文件）
• 使用 esbuild 预构建依赖

3.2 快速创建项目

npm create vite@latest my-project
cd my-project
npm install
npm run dev

项目结构说明：
├── node_modules/ # 依赖库
├── public/ # 静态资源
├── src/ # 源代码
│ ├── main.js # 入口文件
│ └── App.vue # 根组件
├── index.html # 页面模板
└── vite.config.js # 配置文件

3.3 核心优势

1. 闪电般启动：毫秒级冷启动

2. 即时热更新：保持应用状态的热替换

3. 开箱即用：
   TypeScript 支持
   CSS 预处理器
   文件系统路由

4. 多框架支持：Vue、React、Svelte 等

四、使用 Vite 搭建 Vue 3 项目的完整指南

4.1 环境准备

• Node.js 18+ （推荐使用 LTS 版本）
• 包管理器：npm 9+ / yarn 1.22+ / pnpm 7+
• 代码编辑器：VS Code（推荐安装 Volar 扩展）

检查环境

node -v
# 应显示 v18.x.x 或更高版本

npm -v
# 应显示 9.x.x 或更高版本

4.2 项目初始化

4.2.1 快速创建项目

npm create vite@latest vue-demo -- --template vue
cd vue-demo
npm install

4.2.2 项目结构解析

├── public/ # 静态资源目录
│ └── favicon.ico
├── src/
│ ├── assets/ # 动态资源（图片、字体等）
│ ├── components/ # 公共组件
│ ├── App.vue # 根组件
│ └── main.js # 应用入口
├── index.html # 主页面模板
├── package.json # 项目配置
├── vite.config.js # Vite 配置文件
└── .gitignore # Git 忽略规则

4.3 配置文件详解

4.3.1 vite.config.js 基础配置

import {
    defineConfig } from 'vite'