windows系统安装指定的vue/cli、node和npm;vue/cli脚手架搭建项目所涉及的vue/cli、node、npm依赖版本等问题


文章目录

  • 前言
  • 一、安装vue/cli脚手架
    • 1.安装指定版本脚手架,我是用的3.12.0版本
    • 2.查看版本是否安装成功,成功有版本号
    • 2.1问题:安装失败
    • 2.2解决方案
    • 2.3 安装成功
  • 二、安装指定node和npm
    • 1.为什么需要安装指定node和npm版本,同时匹配vue/cli版本?
    • 2.如何安装node和npm匹配的版本?(node14.21.3 npm6.14.18)
    • 3.1进入node中文官网,点击其他下载
    • 3.2先前所有已发布版本
    • 3.3找到自己需要的版本
    • 3.4下载对应的zip安装包
    • 3.5解压里面就有node和npm
    • 3.6`使用cmd`,命令输入`where node`,找到你原来node安装地址
    • 3.7复制上方node.js地址,选中所有删除
    • 3.8将解压的新node所有文件复制到原node文件夹
    • 3.9 需要管理员权限
    • 3.10 至此node和npm完成安装
  • 总结


前言

记录vue/cli脚手架搭建项目所涉及的vue/cli、node、npm依赖版本等问题

先说依赖版本:
vue/cli 3.12.0
node14.21.3
npm6.14.18
注意: node和npm需要版本匹配,也就是下载node安装包,就会自带安装npm,不可制定升级某个版本npm;
否则会导致脚手架创建项目失败vue项目启动失败npm下载依赖不支持
在这里插入图片描述


具体步骤和问题如下:

一、安装vue/cli脚手架

1.安装指定版本脚手架,我是用的3.12.0版本

按住shift——鼠标右键,就可以打开Windows PowerShell
在这里插入图片描述

npm install -g @vue/cli@3.12.0

2.查看版本是否安装成功,成功有版本号

安装完成后查看 使用过 vue -V 查看vue/cli版本号
在这里插入图片描述

2.1问题:安装失败

2.1.1问题:如果查看找不到版本,使用命令行创建项目vue create my-demo也无效
或者在用脚手架搭建vue项目时,提示:
无法加载文件C:\Users\1111111\AppData\Roaming\npm\vue.ps1,因为在此系统禁止运行脚本这是你笔记本禁止运行脚本
在这里插入图片描述

2.2解决方案

2.2.1 需要用管理员方式打开Windows PowerShell在这里插入图片描述

2.2.2输入set-ExecutionPolicy RemoteSigned,然后选择 Y 回车
在这里插入图片描述
然后在查看vue -V版本号就正常了,也可以直接脚手架创建项目了。

2.3 安装成功

至此,vue/cli脚手架就安装成功了

二、安装指定node和npm

node中文官网

1.为什么需要安装指定node和npm版本,同时匹配vue/cli版本?

如果node和npm版本不匹配,会导致两个问题:

1.1vue/cli创建项目时候,报错npm WARN npm npm does not support Node. js v14. 21.3,npm支不支持node不匹配
在这里插入图片描述

1.2vue项目,npm install 安装依赖也会报错,下载不了依赖

如果npm和vue/cli版本不匹配,会导致一个问题:

1.3vue create my-demo创建vue项目时候失败,报错如下:
command failed: npm install --loglevel error
npm ERR!Invalid dependency type requested: alias

如果node和vue/cli版本不匹配在启动vue项目时候,如果失败会提醒你需要哪个node版本),会导致一个问题:

1.4vue项目启动运行失败,报错:
ERROR You are using Node v10.15.3, but vue-cli-service reguires Node ^12.0.0= 14.0.0. Please upgrade your Node version .
在这里插入图片描述

2.如何安装node和npm匹配的版本?(node14.21.3 npm6.14.18)

直接去官网下载完成node的zip包,解压后包含自带npm包,这就是匹配版本。替换你来node安装的文件即可。

3.1进入node中文官网,点击其他下载

node中文官网在这里插入图片描述

3.2先前所有已发布版本

在这里插入图片描述

3.3找到自己需要的版本

这里就是自带npm,是相匹配的版本。在这里插入图片描述

3.4下载对应的zip安装包

在这里插入图片描述

3.5解压里面就有node和npm

在这里插入图片描述

3.6使用cmd,命令输入where node,找到你原来node安装地址

在这里插入图片描述

3.7复制上方node.js地址,选中所有删除

在这里插入图片描述

3.8将解压的新node所有文件复制到原node文件夹

注意:复制前,需要关闭所有涉及node的运行文件,例如你的项目、vscode、PowerShell等
这里是引用

3.9 需要管理员权限

其实就是需要你先关闭所有的node文件,然后点击继续,就会复制进去文件;但是有可能只复制了部分文件,需要一直点击继续,直到全部复制完成。
在这里插入图片描述

3.10 至此node和npm完成安装


总结

一定要保证,node和npm版本匹配,然后和vue/cli也匹配(在启动vue项目时候,如果失败会提醒你需要哪个node版本)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/8271.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

脑电信号处理与特征提取——2.脑电的神经起源与测量(夏晓磊)

目录 二、脑电的神经起源与测量 2.1 脑电的神经起源 2.2 脑电的测量 二、脑电的神经起源与测量 2.1 脑电的神经起源 脑电起源于大脑皮层大量神经元的同步突触活动,主要贡献来自锥体细胞。 静息电位:内负外正,K内流。 动作电位&…

elementui plus 图标循环加载

今天在学习vue3时,在用Element Plus布局页面时,遇到了一个图标循环加载的问题。开始不知道如何渲染图标,以为像ElementUI 一样可以通过class进行渲染图标,发现无法使用,让后我发现引用的图标是组件,组件的话…

V1.4基站仓储三代标签操作指导

一、管理系统使用 1、启动v1.4基站 插上电源,用网线连接基站和电脑。基站默认ip为192.168.1.200,所以需要修改电脑的IP地址为192.168.1.x,例如:192.168.1.100 ​ 注:当基站第二个灯(绿色)闪烁…

Leetcode 111. 二叉树的最小深度

题目描述 题目链接:https://leetcode.cn/problems/minimum-depth-of-binary-tree/description/ 思路 DFS 代码实现 class Solution {public int minDepth(TreeNode root) {return Depth(root);}public int Depth(TreeNode root){if(rootnull){return 0;}int lef…

云安全攻防(一)之 云原生

前言 随着公有云和私有云的广泛部署,云计算基础设施成为企业部署新业务的首选。可以说,云计算已进入下半场,各大云计算服务商的厮杀日益激烈,新的概念也不断的层出不穷。近年来,云原生安全(Cloud Native C…

数据结构之Queue的实现

Queue支持的方法 方法名参数功能返回Sizevoid返回链表规模(该方法由List< T>派生而来)emptyvoid返回链表是否为空(该方法由List< T>派生而来)frontvoid返回队首数据域的引用enqueueT const & e入队voiddequeuevoid出队出队的对象 code // Queue.h # pragma …

赛多利斯Sartorius天平java后端对接

业务场景 要将赛多利斯天平的数据读出来解析并且显示到对应的数字框,支持一台设备连接多种精度的天平 后端实现 通过协议解析数据,然后将数据存储 详细代码就不贴了,感兴趣的可以私聊我

oracle报错:ORA-10997,ORA-09967解决

报错信息&#xff1a; ORA-10997: another startup/shutdown operation of this instance inprogress ORA-09967: unable to create or open lock file Linux-x86_64 Error: 13: Permission denied 权限问题&#xff0c;修改Oracle目录权限 chown -R oracle:dba /home/tmn/sof…

Jupyter 安装、简单操作及工作路径更换

一、Jupyter下载安装 pip install jupyterAnaconda是Python另一个非常流行的发行版&#xff0c;它之后有着自己的叫做“conda”的安装工具。用户可以使用它来安装很多第三方包。然而&#xff0c;Anaconda会预装很多包&#xff0c;包括了Jupyter Notebook,所以若已经安装了Anac…

创建Electron项目

一、使用vite 构建 electron项目 npm init vitelatest Need to install the following packages:create-vitelatest Ok to proceed? (y) y √ Project name: ... CertificateDownload √ Package name: ... certificatedownload √ Select a framework: Vue √ Select a var…

C# 用于模拟web表单提交,解析返回的json数据

以下是一个示例的实现代码&#xff0c;用于模拟web表单提交&#xff0c;解析返回的json数据&#xff0c;并在DataGridView中展示数据&#xff1a; csharp using System; using System.Collections.Generic; using System.Net; using System.Net.Http; using System.Windows.Fo…

(学习笔记-IP)IP基础知识

基本认识 IP在TCP/IP参考模型中处于第三层&#xff0c;也就是网络层。 网络层的主要作用是&#xff1a;实现主机与主机之间的通信&#xff0c;也叫点对点的通信。 网络层与数据链路层的关系&#xff1a; MAC的作用是实现直连的两个设备之间通信&#xff0c;而IP负责没有直连的…

3ds Max图文教程: 使用动态工具Mass FX 创建风铃动画

推荐&#xff1a; NSDT场景编辑器助你快速搭建可二次开发的3D应用场景 1. 简单的场景设置 步骤 1 打开 3ds Max。 打开 3ds Max 步骤 2 我将向您展示风铃背后的动态 通过简单的场景设置进行模拟。一旦你有了这个想法&#xff0c;你就可以应用这个 技术到复杂的风铃结构。 基…

深圳国际新能源及智能网联汽车全产业博览会今年10月举办

7月25日&#xff0c;深圳市工业和信息化局与励展博览集团共同在深圳举办Automotive World China 2023深圳国际新能源及智能网联汽车全产业博览会&#xff08;简称“AWC 2023”&#xff09;全球推介启动大会&#xff0c;该博览会将于2023年10月11日-13日在深圳国际会展中心盛大举…

SpringBoot自动装配原理

自动配置 pom.xml spring-boot-dependencies:核心依赖在父工程中&#xff01;我们在写或者引入一些springboot以来的时候&#xff0c;不需要指定版本&#xff0c;就因为有这些版本仓库 启动器 <!-- 启动器 --><dependency><groupId>org.springf…

激光雷达-相机联合标定

https://f.daixianiu.cn/csdn/9499401684344864.html ros usb相机内参标定 ROS系统-摄像头标定camera calibration_berry丶的博客-CSDN博客

详解CMakeLists.txt

在前一篇文章 esp32 初识 cmake 构建工具 中&#xff0c;已经用"hellow world"程序介绍了cmake最基本的用法&#xff0c;今天详细讲解CMakeLists.txt文件。 CMakeLists.txt CMakeLists.txt文件是CMake构建工具的核心配置文件。它包含了构建项目所需的一系列指令和参…

20230724----重返学习-vue3知乎日报项目实战

day-119-one-hundred-and-nineteen-20230724-vue3知乎日报项目实战 vue3项目实战-知乎日报 主要问题 pinia 和 vuex4 的区别 vue/cli和vite的区别 vue/cli脚手架的底层核心是webpack。vite脚手架&#xff1a; 开发环境&#xff1a;基于ESModule模块规范处理的生产环境&#…

PHPWord 实现合并多个word文件

PHPWord 本来想着当调包侠呢&#xff0c;结果翻了一遍文档&#xff0c;没有这种操作支持&#xff0c;阿这&#x1f602; GPT 不出意外的一顿胡扯&#xff0c;给&#x1f468;‍&#x1f9b3;气的要中风啦 思路 word 也就是docx结尾的文件本质上就是xml字符串&#xff0c; …

为什么很多程序员不用switch,而是大量 的if......else if?

不会吧还有人用if else和switch case&#xff1f;三目运算符&#xff1f; 不会吧&#xff1f; 不会吧&#xff1f;大佬都是全都不用的&#xff01;以JAVA为例 条件判断语句的四种写法&#xff0c;茴字的四种写法大家不会不知道吧 1.正常人写法&#xff1a; private static …