nodejs下载+react安装

一、nodejs安装

1、nodejs下载

具体安装可参考连接:2023最新版Node.js下载安装及环境配置教程(非常详细)从零基础入门到精通,看完这一篇就够了_nodejs安装及环境配置-CSDN博客

下载地址:Node.js — 下载 Node.js®

测试安装是否成功:

node -v     // 显示node.js版本
npm -v      // 显示npm版本

2、环境配置

找到安装的目录,在安装目录下新建两个文件夹[node_global]和[node_cache]

创建完毕后,使用管理员身份打开cmd命令窗口,输入

npm config set prefix “你的路径\node_global” (复制你刚刚创建的“node_global”文件夹路径)

npm config set prefix "D:\develop\Node.js\node_global"

npm config set cache “你的路径\node_cache” (复制你刚刚创建的“node_cache”文件夹路径)

npm config set cache "D:\develop\Node.js\node_cache"

3、配置环境变量

【此电脑】-单击右键-【属性】-【高级系统设置】-【环境变量】

在【系统变量】中点击【新建】

变量名:NODE_PATH

变量值:C:\Program Files\nodejs\node_global\node_modules

然后你就会发现【node_global】里多出了一个【node_modules】文件夹

Ps: 如果输入变量值之后没有自动创建【node_modules】文件夹,就在【node_global】下手动创建一个【node_modules】文件夹,再复制你创建的【node_modules】文件夹的路径地址到变量值

编辑【用户变量】中的【Path】

将默认的 C 盘下【 AppData\Roaming\npm 】修改成 【node_global】的路径,点击确定

在【系统变量】中选择【Path】点击【编辑】添加【NODE_PATH】,随后一直点击【确定】

4、测试

npm install express -g   // -g代表全局安装

出现以下界面即为配置成功

5、安装淘宝镜像

PS: 这里好像镜像和之后用的有些差别,大家可以搜搜别的镜像

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

查看是否成功:

npm config get registry

二、react安装、启动

使用 Create React App:使用 Create React App 脚手架来创建一个新的 React 项目。使用以下命令:

npx create-react-app my-app

方法一:

进入项目目录:创建完成后,进入你的新项目目录:

cd my-app
npm start

方法二:

用vscode打开创建的“my-app”文件夹,然后从终端处启动。

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

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

相关文章

ubuntu 更新源

前言 实现一键替换在线源 一键更新源 ubuntu 全球镜像站以下支持现有ubuntu 20&#xff0c;22&#xff0c;24 echo "Delete the default source" rm -rf /etc/apt/sources.listecho "Build a new source" cat <<EOF>>/etc/apt/sources.li…

微信小程序 button样式设置为图片的方法

微信小程序 button样式设置为图片的方法 background-image background-size与background-repeat与border:none;是button必须的 <view style" position: relative;"><button class"customer-service-btn" style"background-image: url(./st…

MVC架构在Web开发中的实现

MVC架构在Web开发中的实现 1、MVC架构概述2、MVC架构的实现 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收藏不迷路&#x1f496; 在Web开发领域&#xff0c;MVC&#xff08;Model-View-Controller&#xff09;架构模式是一种广泛使用的软件设计模式&#xff0c…

【学习笔记】虚幻SkeletalMesh学习(一)基础介绍

文章目录 零、前言一、资源介绍1.1 骨架资源1.2 骨架网格体资源 二、UE4中的定义2.1 骨骼数据2.2 模型网格数据 三、渲染3.1 RenderData的初始化3.2 渲染对象的创建3.3 渲染对象的更新3.3.1 游戏线程的更新&#xff08;*FSkeletalMeshObjectGPUSkin::Update*&#xff09;3.3.2 …

Android11 framework 禁止三方应用开机自启动

Android11应用自启动限制 大纲 Android11应用自启动限制分析验证猜想&#xff1a;Android11 AOSP是否自带禁止三方应用监听BOOT_COMPLETED​方案禁止执行非系统应用监听到BOOT_COMPLETED​后的代码逻辑在执行启动时判断其启动的广播接收器一棍子打死方案&#xff08;慎用&#…

矩阵形式的bezier曲线

本文分享一段矩阵形式的bezier代码&#xff1a; clc clear% 控制点 P [25;10;5;13]; %% 获得M矩阵 n length(P) - 1; M zeros(n1,n1); for i 1:n1for j 1:n1if(ij<n3)M(i,j) (-1)^(n -i-j2)*nchoosek(n,n-i1)*nchoosek(n-i1,j-1);elseM(i,j) 0;endend end t_temp l…

buu做题(5)

目录 [GXYCTF2019]禁止套娃 方法一: 方法二: [NCTF2019]Fake XML cookbook [GXYCTF2019]禁止套娃 页面里啥也没有 使用dirsearch 扫一下目录 发现有 git 使用工具githack拉取源码 <?php include "flag.php"; echo "flag在哪里呢&#xff1f;<br&g…

PostgreSQL使用(三)

说明&#xff1a;本文介绍PostgreSQL的数据类型和运算符&#xff1b; 数据类型 常用的数据类型如下&#xff1a; 运算符 如下&#xff1a; 运算符的优先级如下&#xff1a; 不需要强记硬背&#xff0c;只需要记住括号可以提高运算符的优先级即可&#xff1b; 总结 本文介绍…

【JavaEE进阶】——Spring AOP

目录 &#x1f6a9;Spring AOP概述 &#x1f6a9;Spring AOP快速⼊⻔ &#x1f393;引入AOP依赖 &#x1f393;编写AOP程序 &#x1f6a9;Spring AOP 详解 &#x1f393;Spring AOP核⼼概念 &#x1f393;通知类型 &#x1f393;PointCut &#x1f393;切⾯优先级 Ord…

【JavaScript 算法】拓扑排序:有向无环图的应用

&#x1f525; 个人主页&#xff1a;空白诗 文章目录 一、算法原理二、算法实现方法一&#xff1a;Kahn算法方法二&#xff1a;深度优先搜索&#xff08;DFS&#xff09;注释说明&#xff1a; 三、应用场景四、总结 拓扑排序&#xff08;Topological Sorting&#xff09;是一种…

核函数支持向量机(Kernel SVM)

核函数支持向量机&#xff08;Kernel SVM&#xff09;是一种非常强大的分类器&#xff0c;能够在非线性数据集上实现良好的分类效果。以下是关于核函数支持向量机的详细数学模型理论知识推导、实施步骤与参数解读&#xff0c;以及两个多维数据实例&#xff08;一个未优化模型&a…

笔记 3 : 继续彭老师课本第 3 章的 arm 的汇编指令

&#xff08;26&#xff09; 指令 LDR &#xff1a; &#xff08;27&#xff09; STR &#xff1a; 可见&#xff0c;从语法上将&#xff0c; &#xff01; 提示编译器进行更复杂的编译&#xff0c;对应内涵更复杂的指令。 &#xff08;28&#xff09; LDR 与 STR 指令还可…

Android C++系列:Linux信号(三)

可重入函数 不含全局变量和静态变量是可重入函数的一个要素可重入函数见man 7 signal在信号捕捉函数里应使用可重入函数在信号捕捉函数里禁止调用不可重入函数例如:strtok就是一个不可重入函数,因为strtok内部维护了一个内部静态指针,保存上一 次切割到的位置,如果信号的捕捉…

echarts实现3d柱状效果

代码如下&#xff0c;单个的调第一个方法&#xff0c;多个柱状的调第二个方法&#xff0c;具体情况修改参数或者二次开发即可 //3d柱状图 export function getEcharts3DBar (xAxisData:string[][name1,name2,name3], data:number[][1,2,3], colorObj:IBaseObject{topStartColo…

通过albumentation对目标检测进行数据增强(简单直接)

albumentation官方文档看不懂&#xff1f;xml文件不知道如何操作&#xff1f;下面只需要修改部分代码即可上手使用 要使用这个方法之前需要按照albumentation这个库还有一些辅助库,自己看着来安装就行 pip install albumentation pip install opencv-python pip install json…

MKS流量计软件MFC通讯驱动使用于C和P系列MFC控制USB接口W10系统

MKS流量计软件MFC通讯驱动使用于C和P系列MFC控制USB接口W10系统

使用VuePress-Reco快速搭建博客(保姆级)

简介&#xff1a;VuePress-Reco 一款简洁的 vuepress 博客 & 文档 主题&#xff0c;可以自由搭建自己的风格&#xff0c;比较方便简洁。 链接&#xff1a;vuepress-reco 准备环境&#xff1a; Node.Js >20.5.0&#xff0c;Npm > 10.8.2 OR Yarn > 1.22.19 注&am…

Kafka介绍及Go操作kafka详解

文章目录 Kafka介绍及Go操作kafka详解项目背景解决方案面临的问题业界方案ELKELK方案的问题日志收集系统架构设计架构设计组件介绍将学到的技能消息队列的通信模型点对点模式 queue发布/订阅 topicKafka介绍Kafka的架构图工作流程选择partition的原则ACK应答机制Topic和数据日志…

0718,TCP协议,三次握手,四次挥手

目录 上课喵&#xff1a; TCP&#xff08;Transmission Control Protocol&#xff0c;传输控制协议&#xff09;的状态迁移图 TCP连接的状态迁移图 状态迁移说明&#xff1a; 注意&#xff1a; big_htonl.c 字节序转换 addr.c IP地址的转换 作业喵&#xff1a; …

前端组件化实践:Vue自定义加载Loading组件的设计与实现

摘要 随着前端技术的飞速发展&#xff0c;组件化开发已成为提高开发效率、降低维护成本的重要方法。本文介绍了前端Vue自定义加载Loading组件的设计思路与实现过程&#xff0c;该组件通过设置gif动画实现加载效果&#xff0c;可广泛应用于页面请求加载场景。通过该组件的实践&…