包管理
npm包管理与基本命令
Node.js是JavaScript运行环境，NPM是Node.js默认的包管理工具
1. 初始化项目
bash
npm init2. 安装依赖
bash
npm install # 安装package.json中所有依赖
npm install [包名] # 安装并添加依赖到package.json
npm install -g [包名] # 全局安装包3. 卸载依赖
bash
npm uninstall [包名] # 卸载并从package.json移除
npm uninstall -D [包名] # 卸载开发依赖
npm uninstall -g [包名] # 全局卸载4. 更新依赖
bash
npm update # 更新所有依赖到最新兼容版本
npm update [包名] # 更新单个包5. 运行脚本
bash
npm run [脚本名] # 执行package.json中定义的脚本
npm xxx # 执行"xxx"脚本6. 查看包信息
bash
npm list # 查看已安装的依赖树
npm list -g # 查看全局安装的包7. 其他
bash
npm -v
npm help运行项目
bash
npm run devyarn包管理
yarn由Facebook开发
1. 初始化项目
bash
yarn init2. 安装依赖
bash
yarn # 安装package.json中所有依赖（相当于npm install）
yarn add [包名] # 安装并添加依赖到package.json
yarn add [包名]@[版本号] # 安装指定版本
yarn add [包名] --dev # 安装为开发依赖（相当于npm install -D）
yarn global add [包名] # 全局安装包3. 卸载依赖
bash
yarn remove [包名] # 卸载并从package.json移除
yarn global remove [包名] # 全局卸载4. 更新依赖
bash
yarn upgrade # 更新所有依赖到最新兼容版本
yarn upgrade [包名] # 更新单个包5. 运行脚本
bash
yarn [脚本名] # 执行package.json中定义的脚本
yarn start # 执行"start"脚本6. 查看包信息
bash
yarn list # 查看已安装的依赖树7. 其他常用命令
bash
yarn version # 查看yarn版本
yarn cache clean # 清除缓存运行项目
bash
yarn devYarn特性优势
- 并行安装：速度更快
- 确定性安装：通过
yarn.lock确保依赖一致性 - 离线模式：支持离线安装已下载的包
- 网络优化：更智能的缓存和重试机制
npm与yarn对比
npm 串行安装，较慢，有更加复杂的钩子脚本，nodejs官方指定
yarn 并行安装，较快，依赖锁定严格
nvm（管理node版本）
具体安装 博客 nvm | lihuibear
nvm命令
nvm list available
查看可安装的版本
nvm install 版本号
安装对应的版本
nvm use 版本号
使用对应的版本
nvm list
查看已经安装的node
vite 与 webpackage对比
| 特性 | Vite | Webpack |
|---|---|---|
| 构建原理 | ES 模块原生导入 | 打包一切 |
| 开发服务器 | 冷启动，热更新，速度快 | 需要完整构建，速度慢 |
| 生态支持 | 原生支持一些，其他的需要下载插件 | 生态成熟 |
| 生产环境构建 | 使用 Rollup 打包，输出优化的静态资源。 | 支持懒加载，多入口 |
| 适用场景 | 快速开发的项目，Vue/React项目（推荐） | 大型项目，需要自定义的项目 |
| 社区活跃度 | 增长迅速，Vue/React 官方推荐，插件生态快速完善。 | 长期主导地位，生态稳定但创新速度较慢。 |
如何创建vue项目
一般方式 vue脚手架 默认也是vite
使用 Vue 官方推荐的脚手架 create-vue 快速创建 Vue3 的项目
npm create vue@latest
然后有可视化界面
vite方式
npm create vite@latest
路由配置
创建router
使用Vue Router
在src下新建router文件夹,在router文件夹下新建router.ts (可以脚手架自己生成)
创建页面文件
创建过了，HomeView.vue
绑定实例
加载路由
