前端环境的安装 Node npm yarn

一  node + npm 

1.下载NodeJS安装包

下载地址:Download | Node.js

2.开始安装

打开安装包后,一直Next即可。当然,建议还是修改一下安装位置,NodeJS默认安装位置为 C:\Program Files

3.验证是否安装成功
打开DOS命令界面:

node -v

 

出现NodeJS版本即为安装成功!

npm -v
 

 出现npm的版本号说明npm工具也已安装成功!

二、环境配置

说明:环境配置的目的主要是为了改变安装NodeJS依赖的下载位置,方便日后管理,以及配置缓存Cache的路径。因为NodeJS在执行安装语句时,会将安装的模块默认安装到**C:\Users\用户名\AppData\Roaming\npm**,从而占用C盘的空间。

1.创建npm模块安装目录

安装时,默认是使用国外的镜像,速度较慢。推荐使用国内镜像!

分别在NodeJS安装目录下创建node_cache和node_global两个文件夹,如上图所示。
创建文件夹后,打开dos命令窗口,分别执行下面两行命令

npm config set prefix "D:\MySoftware\nodejs\node_global"
npm config set cache "D:\MySoftware\nodejs\node_cache"

2.配置环境变量
我的电脑->右键->属性->高级系统设置->高级->环境变量

2.1新建NODE_PATH系统变量

 其实看到这个变量值我开始是有一些疑问的,明明node_global是一个空文件夹,为什么这个值需要定义到一个不存在的文件夹上,原来后面node会自动创建。

三、测试

我们先安装一个express模块试试

打开dos命令窗口,执行下面的命令

npm install express -g      # -g  是全局安装的意思

 安装成功!
打开D:\MySoftware\nodejs\node_global\node_modules目录

4、配置taobao源
//查看镜像源
npm get registry
//修改成淘宝镜像源
npm config set registry https://registry.npm.taobao.org

四 yarn 的安装 

1 安装yarn

//全局下载yarn
npm install -g yarn
//全局删除yarn
npm uninstall yarn -g

2 配置 环境变量

配置环境变量其实原理很简单,就是把你安装的文件目录添加到 Path 系统变量中,这样在执行的时候就能够找到这些文件。所以只需要把下面的路径(安装路径,就是可执行文件 yarn.cmd 的位置,此处是通过 npm 全局安装的)添加到 Path 中即可。

复制yarn 安装地址

添加到path 

打开 命令行 测试 成功

安装目录下 新建 yarn_global  yarn_cache 文件 

下载目录是为了配置 通过 yarn 安装的全局命令工具的存储位置。

# 全局安装目录
yarn config set global-folder "D:\Program Files (x86)\nodejs\node_globa\node_modules\yarn\yarn_global"

# 缓存目录
yarn config set cache-folder "D:\Program Files (x86)\nodejs\node_globa\node_modules\yarn\yarn_cache"

检验是否设置成功,可以直接在C:\Users\用户名目录下打开.yarnrc文件查看

如果你遇到了yarn命令无法执行的情况,可以试着删掉这个文件再重新配置

3. 淘宝镜像源

原始资源有时候是外网的,下载速度比较慢。配置淘宝镜像源,是为了加快安装依赖的速度。

# 查看当前源
yarn config get registry

# 修改为淘宝镜像源
yarn config set registry https://registry.npm.taobao.org

至此 node  npm  yarn 就全部安装完毕了 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

基于jsp,ssm物流快递管理系统

开发工具:eclipse,jdk1.8 服务器:tomcat7.0 数据库:mysql5.7 技术: springspringMVCmybaitsEasyUI 项目包括用户前台和管理后台两部分,功能介绍如下: 一、用户(前台)功能: 用…

无线振动传感器安装

lora无线温振一体传感器即传感器的采集时间,采集方式完全有主机通过命令实现。其主要特点是:传感器平时处在低功耗状态、传感器可以随时响应远程主机控制命令、传感器可采集特征值或者原始加速度数据 lora 技术,提高了传输速率多振动&#xf…

程序开发官网地址汇总

这里写目录标题 官网地址汇总开发环境开发工具数据库驱动包其他 官网地址汇总 开发环境 1 JDK :https://www.oracle.com/java/technologies/java-se-glance.html 2 Maven:https://maven.apache.org/download.cgi 3 Maven Repository: https://mvnrep…

项目管理-挣值管理例题-使用SV进度偏差和CV成本偏差来判断进度和成本是否合适

基础概念介绍 CV和SV的计算公式 在财务分析中,常常会用到CV和SV这两个指标。CV是成本偏差,SV是进度偏差。它们的计算公式如下: CV EV - AC SV EV - PV 其中,EV是挣值,AC是实际成本,PV是计划价值。 …

Qt之基于QCustomPlot绘制直方图(Histogram),叠加正态分布曲线

一.效果 二.原理 1.正态分布 高斯分布(Gaussian distribution),又名正态分布(Normal distribution),也称"常态分布",也就是说,在正常的状态下,一般的事物,都会符合这样的分布规律。 比如人的身高为一个随机变量,特别高的人比较少,特别矮的也很少,大部分都…

idea插件(一)-- SequenceDiagram(UML自动生成工具)

目录 1. 安装 2. 默认快捷键 3. 操作说明 4. 导出为图片与UML类图 4.1 导出为图片: 4.2 导出 UML 类图 SequenceDiagram是从java、kotlin、scala(Beta)和groovy(limited)代码生成简单序列图(UML&…

【Java】多线程案例(单例模式,阻塞队列,定时器,线程池)

❤️ Author: 老九 ☕️ 个人博客:老九的CSDN博客 🙏 个人名言:不可控之事 乐观面对 😍 系列专栏: 文章目录 实现安全版本的单例模式饿汉模式类和对象的概念类对象类的静态成员与实例成员 懒汉模式如何保证…

微信小程序面试题之理论篇

本文内容,来源于极客学院的分享,这里只做引用。 说说你对微信小程序的理解?优缺点? 背景 小程序与H5 优缺点 优点:缺点: 说说微信小程序的生命周期函数有哪些? 应用的生命周期页面的生命期组件的生命周期执行过程 应…

【前端早早聊直播回顾】Harmony Next 与 Flutter 的不解之缘

Hello 大家好,我是 Flutter GDE 郭树煜,本次要分享的话题是关于鸿蒙与 Flutter 的故事,可能没接触过的会感觉有点懵,Harmony 和 Flutter 有啥关系,它们怎么会被放到一起讲了呢?接下来就让我们来聊聊这个问题…

Apache Dolphinscheduler如何不重启解决Master服务死循环

个人建议 Apache Dolphinscheduler作为一个开源的调度平台,目前已经更新到了3.X版本,4.0版本也已经呼之欲出。3.0版本作为尝鲜版本,新添加了许多的功能,同时也存在非常多的隐患,本人使用3.0版本作为生产调度也踩了很多…

【C++】C++11常见特性

🌇个人主页:平凡的小苏 📚学习格言:命运给你一个低的起点,是想看你精彩的翻盘,而不是让你自甘堕落,脚下的路虽然难走,但我还能走,比起向阳而生,我更想尝试逆风…

Selenium3-获取元素的css属性

来个元素CSS值 代码1: 通过javaScript执行脚本获取css值 String jsStr "return document.getElementById(\"buyers\").style.getPropertyValue(width)"; Object o ((JavascriptExecutor) driver).executeScript(jsStr); System.out.println(o.toString(…

机器学习-特征工程

一、特征工程介绍 1.1 什么是特征 数值特征(连续特征)、文本特征(离散特征) 1.2 特征的种类 1.3 特征工程 特征是机器学习可疑直接使用的,模型和特征之间是一个循环过程; 实际上特征工程就是将原始数据…

[ poi-表格导出 ] java.lang.NoClassDefFoundError: org/apache/poi/POIXMLTypeLoader

解决报错: org.springframework.web.util.NestedServletException: Handler dispatch failed; nested exception is java.lang.NoClassDefFoundError: org/apache/poi/POIXMLTypeLoader 报错描述: 表格导出本来使用正常,偶然就报了以上错误…

前端react入门day02-React中的事件绑定与组件

(创作不易,感谢有你,你的支持,就是我前行的最大动力,如果看完对你有帮助,请留下您的足迹) 目录 React中的事件绑定 React 基础事件绑定 使用事件对象参数 传递自定义参数 同时传递事件对象和自定义参…

商城小程序开发流程详解:一步步打造专属电商应用

​随着移动互联网的普及,电商行业也迅速发展起来。而商城小程序作为电商行业中的一种新形式,越来越受到企业和个人的关注。那么,如何开发一款专属的商城小程序呢?下面给大家介绍商城小程序的开发流程,帮助大家一步步打…

【Mybatis-Plus】代码生成器

目录 安装插件 数据库建表 Other Config Database Code Generator 根据创建好的数据库表,来直接生成代码 安装插件 数据库建表 Other 点开之后有两个功能 1.数据库配置 2.代码生成 Config Database 首先点开这个配置数据库 Code Generator 配置完数据库…

vue项目中定制化音频展示,wavesurfer.js基本使用

效果图&#xff1a; wavesurfer是一个可定制的音频波形可视化&#xff0c;建立在Audio API和HTML5 Canvas之上。 基本使用&#xff1a; <body><script src"https://unpkg.com/wavesurfer.js"></script><div id"waveform"></di…

大厂面试题-JVM为什么使用元空间替换了永久代?

目录 面试解析 问题答案 面试解析 我们都知道Java8以及以后的版本中&#xff0c;JVM运行时数据区的结构都在慢慢调整和优化。但实际上这些变化&#xff0c;对于业务开发的小伙伴来说&#xff0c;没有任何影响。 因此我可以说&#xff0c;99%的人都回答不出这个问题。 但是…

分享8个分布式Kafka的使用场景

Kafka 最初是为海量日志处理而构建的。它保留消息直到过期&#xff0c;并让消费者按照自己的节奏提取消息。与它的前辈不同&#xff0c;Kafka 不仅仅是一个消息队列&#xff0c;它还是一个适用于各种情况的开源事件流平台。 1. 日志处理与分析 下图显示了典型的 ELK&#xff0…