当前位置: 首页 > article >正文

Node.js和Vue CLI 安装指南(Windows 系统)

Node.js 与 Vue CLI 安装指南(Windows 系统)

一、Node.js 安装步骤

1. 安装包获取

  • 官网下载:Node.js 官网
  • 推荐选择 LTS 版本(长期支持版)
  • 双击运行安装包:

2. 安装向导配置

  • 点击 "Next" 进入安装界面:
  • 安装路径选择
    • 新建英文路径(如 D:\NodeJS
    • 禁止包含中文或空格(否则会导致依赖安装失败)
  • 勾选关键选项
    (自动配置环境变量)

 

3. 完成安装

  • 点击 "Finish" 结束安装流程。
二、环境验证

1. 检查 Node.js 和 npm

  • 打开命令提示符(Win + R → 输入 cmd):
    node -v # 应显示版本号(如 v18.18.2) npm -v # 应显示版本号(如 9.8.1)

2. 配置镜像加速(解决网络问题)

npm config set registry https://registry.npmmirror.com

3. 设置全局安装路径

npm config set prefix "E:\AllEdit\EditNodeJS\NodeJSFile"

三、Vue CLI 安装步骤

1. 清理代理与缓存

npm config set proxy null npm config set https-proxy null npm cache clean --force

2. 安装 Vue CLI

npm install -g @vue/cli

3. 验证安装

vue --version # 应显示版本号(如 @vue/cli 5.0.8)

 

四、常见问题解决
问题类型解决方案
网络错误(ENOTFOUND)1. 检查镜像源是否设置正确
2. 执行 ping registry.npmmirror.com 测试网络
3. 临时关闭防火墙/杀毒软件
权限不足以管理员身份运行命令提示符
命令无法识别重新安装 Node.js 并确认勾选自动配置环境变量选项
安装警告(deprecated)可忽略(由旧版依赖引起,不影响基础功能)
五、高级配置(可选)

1. 恢复官方镜像源

npm config set registry https://registry.npmjs.org

2. 使用淘宝镜像工具(cnpm)

npm install -g cnpm --registry=https://registry.npmmirror.com

3. 全局模块路径管理

npm config set prefix "D:\NodeJS\npm_global"

六、注意事项
  1. 路径规范:所有安装路径必须使用 英文+数字,禁止包含空格或特殊符号(如 Program Files 会导致报错)
  2. 环境变量:若安装后命令仍不可用,手动添加路径到系统变量 PATH 中
  3. 版本兼容
    • Vue 2 已停止维护,建议通过 vue create 时选择 Vue 3 模板
    • 若需长期开发,建议升级 Node.js 至最新 LTS 版本
七、安装后建议
  1. 安装常用工具:
    npm install -g yarn typescript

  2. 开发工具推荐使用 VSCode,并安装插件:Vetur、ESLint
  3. 学习资源:
    • Vue 3 官方文档:https://v3.vuejs.org
    • Node.js 中文网:https://nodejs.cn

提示:若安装过程卡顿,可通过 Ctrl + C 终止后重试,或使用 cnpm 替代 npm 加速下载。


http://www.kler.cn/a/579965.html

相关文章:

  • Python 实现非对称加密的 A 端和 B 端软件的详细步骤及代码示例
  • 电脑维修保养售后服务跟踪软件到哪里下载,佳易王电脑保养维护记录查询可导入图片管理系统操作教程
  • 零成本短视频爆款制造手册
  • gdb调试以及常用相关工具(hexdump\objdump等)
  • U1.【UVA】块问题-The Blocks Problem(补充了pair的使用)
  • c语言笔记 内存管理之栈内存
  • GPT-4 Turbo的重大升级与深远影响
  • Java反射与动态代理:框架设计的基石
  • Android Retrofit 框架注解定义与解析模块深度剖析(一)
  • 利用LLMs准确预测旋转机械(如轴承)的剩余使用寿命(RUL)
  • 【开源】OpenAL、OpenCL、OpenCV 和 OpenGL
  • Git Fast-forward 合并详解:原理、场景与最佳实践
  • 安全保障:渲染101如何守护用户数据?
  • BT-Basic函数之首字母C
  • 数据结构第六节:二叉搜索树(BST)的基本操作与实现
  • C++设计模式-简单工厂模式:从原理、应用、实践指南与常见问题和解决方案深度解析
  • 洛谷P1109 学生分组
  • [Unity3D] 动态立方体贴图系统
  • Android JNI性能优化与字符串加载实践
  • ctf-WEB: 关于 GHCTF Message in a Bottle plus 与 Message in a Bottle 的非官方wp解法