Node.js安装,npm安装yarn步骤

news2025/1/21 1:00:58

第一步,首先安装npm

npm是node.js下的包管理器,node.js的下载网址 Node.js

1.下载安装包后一路无脑点击next最后点击finish即可,安装完成之后打开文件夹就是以下目录。

 

 2.在cmd窗口输入node -v、npm -v查看版本检查是否安装成功

 一般完成以上两步便可以正常使用npm了,若还不能使用,可以对环境变量进行手动配置。

3.安装成功之后配置npm的全局模块的存放路径以及cache的路径,在node主目录下建立node_global及node_cache两个文件夹

 4.打开cmd窗口输入一下两个命令进行配置(这里的文件路径哦~)

npm config set prefix "D:\ruanjian\node\node\node_global"
npm config set cache "D:\ruanjian\node\node\node_cache"

5.配置node_path

桌面“此电脑”右击点击“属性”找到“高级系统设置”,点击“高级” 再点击“环境变量配置”

 

点击path再点击编辑最后点击新建,粘贴路径"D:\ruanjian\node\node\node_global"就好了。

 

 第二步,使用npm安装yarn

1.使用npm安装

npm install -g yarn
yarn --version

2.我在安装好之后,使用yarn命令的时候报错

“yarn : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本。”

导致此错误的原因是,PowerShell 执行策略,默认设置为Restricted不加载配置文件或运行脚本。需变更设置为RemoteSigned,变更过程为:
1)运行 Windows PowerShell(管理员),执行命令set-ExecutionPolicy RemoteSigned更改 PowerShell 执行策略,过程中提示询问是否要更改执行策略?,选择 A 或 Y 。如下图:

2)设置完毕,检验执行yarn config get registry命令,可正常加载执行脚本。

3)使用get-ExecutionPolicy命令,可查看当前 PowerShell 执行策略类型。
 

3. Yarn 淘宝源安装,分别复制粘贴以下代码行到黑窗口运行即可

yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
 

npm 和yarn的区别是什么呢??


1、并行安装:yarn安装包会同时执行多个任务,npm 需等待上一个任务安装完成才能运行下一个任务
2、离线模式:如果你已经安装过一个包,用 yarn 再次安装会从缓存中获取,而 npm 会从网络下载
3、版本锁定:yarn 默认有一个 yarn.lock 文件锁定版本,保证环境统一,而 npm 默认从网络下载最新的最稳定的,版本锁定可以解决包之间版本不兼容问题,npm 也可以通过命令实现版本锁定
4、更简洁的输出:yarn 安装包时输出的信息较少,npm 输出信息冗余。

命令对比:

说明YarnNPM/CNPM
初始化某个项目yarn initnpm init
默认安装依赖包yarn install/linknpm install/link
安装某个依赖并默认保存到packageyarn add taconpm install taco --save
移除某个依赖yarn remove taconpm uninstall taco --save
安装某个开发时的依赖yarn add taco -devnpm install taco --save -dev
更新某个依赖项目yarn upgrade taconpm update taco --save
安装某个全局依赖项目yarn global add taconpm install taco --global
发布/登录/退出,一系列NPM 操作yarn publish/login/logoutnpm publish/login/logout
发布/登录/退出,一系列NPM 操作yarn publish/login/logoutnpm publish/login/logout
运行某个命令yarn run/testnpm run/test


 

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

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

相关文章

总结JS中常用的数组的方法大全

总结JS中常用的数组方法 JS中常用的数组方法总结 数组(Array)是一种复杂的数据类型,它属于Object(对象)类型,用来将一组数组合在一起,通过一个变量就可以访问一组数据。在使用数组时,经常会搭配循环语句使用,从而很方便…

Vue3+TS+Vite+Element Plus搭建后台管理系统

Vue3TSViteElement Plus搭建后台管理系统1、简介2、效果图3、技术栈4、项目目录5、setting.js(全局配置文件)6、路由router7、状态管理stores8、下载地址总结1、简介 该示例是vue3、typescript、vite、element plus搭建前端管理框架,主要模块分为:菜单、…

用 vite 构建 vue3 + TS 项目实战

目录 1、项目初始化 2、eslint 基础配置 3、配置 git commit hook 4、在开发和构建中进行代码规范校验 5、GitCommit规范 6、 Vite中的TS环境说明 7、Vue3 中 Ts 支持 8、Vue3中的script-setup语法 9、script-setup中的编译宏 10、配置转换JSX和TSX 11、初始化…

vue2计算属性computed

1.什么是计算属性 概念: 1.计算属性是vue的一个特性,此属性有计算能力,也就相当于一个函数。可以将计算结果缓存,作为一个属性使用。 特点: 1.要在 methods: { } 或者 computed: { } 中 ,以方…

基于SpringBoot的医疗管理系统(Java毕业设计)

【辰兮要努力】:hello你好我是辰兮,很高兴你能来阅读,昵称是希望自己能不断精进,向着优秀程序员前行! 博客来源于项目以及编程中遇到的问题总结,偶尔会有读书分享,我会陆续更新Java前端、后台、…

鲜花商城系统设计与实现(Java+Web+MySQL)

目 录 摘 要 I Abstract II 1 绪论 1 1.1 现状分析 1 1.2 研究意义 1 1.3 研究方法 1 2 系统的开发环境及技术简介 3 2.1 系统开发环境简介 3 2.2 系统开发技术简介 3 3 可行性研究 7 3.1 经济可行性 7 3.2 技术可行性 7 3.3 操作可行性 7 3.4 法律可行性 7 4 需求分析 9 4.1 …

vue+elementui中el-upload组件上传文件时,修改文件名,不用FormData

前言 今天在开发的时候,后端突然提了一个需求,因为特殊的文件上传不进文件服务器,所以后端问我能不能上传的时候给加个扩展名,本着只要逻辑没问题,都可以通过代码实现的理念,我说:“可以“”&a…

攻防世界WEB练习区(backup、cookie、disabled_button)

前言 作者简介:不知名白帽,网络安全学习者。 博客主页:https://blog.csdn.net/m0_63127854?typeblog 攻防世界专栏:https://blog.csdn.net/m0_63127854/category_11983747.html 网络安全交流社区:https://bbs.csdn.ne…

uniApp h5项目通过命令行打包,并生成指定路径、文件名称

需求:想要自动化部署uni项目,平常的uni项目是通过可视化构建,导致我们的自动部署成了半自动,非常不爽,于是就找到了下面这种方法 首先,用hb新建一个项目 然后,通过cli新建一个项目 文档 vue c…

禁止 input 自动填充

禁止 input 自动填充 在编写 Form 表单样式的时候,修改自动填充后的 input 样式是很麻烦甚至不可行的,而且还有一些不需要自动填充的场景。 浏览器根据保存数据时表单控件的 type 和 name 去匹配。 常用的就是 type 为 password,name 为 em…

Android 设置Padding和Margin(动态/静态)

一、什么是padding,什么是margin? 在Android界面开发时,为了布局更加合理好看,很多时候会用上Padding和Margin, padding和margin是什么呢?即内边距和外边距; 某个View指定为padding是针对该V…

vue制作一个好看的网页

1.安装并配置node.js (见本人博客-node.js) 2.建好的项目目录如下 build: 用来存放项目构建脚本 config: 存放项目的一些基本配置信息,最常用的就是端口转发 node_modules:这个目录存放项目的所有依赖,由npm install 下载来的文件 src:存放项目的源…

Vue设置浏览器小图标(ICON)

Vue设置浏览器小图标 当我们使用浏览器做开发时,我们能希望浏览器标签页能显示自己的logo小图标,这个是怎样设置的呢? 第一步:准备logo图片信息 找到自己的logo,通过图片在线转换格式,转换成32*32的ico为…

css关于文本溢出

处理思路 1)给需要做溢出处理的文本元素设置width或者max-width 2)超出部分省略 overflow:hidden 3) 文本溢出处理方式 text-overflow: ellipsis | clip | 自定义字符 如:“_” “.” 4) 设置文本不换行 white-space: nowrap 单行文本溢出 …

Rust开发WebAssembly在Html和Vue中的应用【后篇】

【建议先看】继上一篇【Rust开发WebAssembly在Html和Vue中的应用】遗留下来的问题 Rust开发WebAssembly在Html和Vue中的应用_一码超人的博客-CSDN博客 本文讲述Vue2与H5版uniapp如何引入rust webassembly的应用流程 在上一文中末尾,我说过vue2在引入胶水js后执行…

关于vue2与vue3

Vue组件之间通信方式有哪些 vue是组件化开发框架,所以对于vue应用来说组件间的数据通信非常重要。 1. 组件通信常用方式有以下8种: props $emit/$on $children/$parent $attrs/$listeners ref $root eventbus vuex 注意vue3中废弃的几个API 在vue3中废除$c…

前端实现tab栏切换,这么常见的案例你学会了吗?

📋 个人简介 💖 作者简介:大家好,我是阿牛,全栈领域新星创作者。😜📝 个人主页:馆主阿牛🔥🎉 支持我:点赞👍收藏⭐️留言&#x1f4d…

vue2 vue-router 不显示页面问题

目录 菜鸟入门,配置vue-router一直不显示。 排除过的问题点: 项目源码如下: 分析: 解决方案: 可能会遇到错误 这vue-router页面总算出来了: 菜鸟入门,配置vue-router一直不显示。 首先去…

el-cascader数据渲染及回显至页面(以及踩坑历程+解决)

第一次使用el-cascader就把坑踩了个遍,写个记录,也希望能够帮助到同为小猿的你们。 下面是我写的一个还原项目的例子 Bug1 首先是最小子集仍然有children,但是children为空数组,el-cascader渲染时,发现有children所…

【已解决】VUE3+webpack >5报错问题

问题截图: This is no longer the case. Verify if you need this module and configure a polyfill for it.If you want to include a polyfill, you need to:- add a fallback resolve.fallback: { "process": require.resolve("process/browser&q…