【前端】node、npm、pnpm部署react项目过程中问题记录

2023-11-10

最近在重新部署一个前后端分离的项目时,在前端环境这里遇到了一些麻烦,通过百度找到的node、npm、pnpm的处理情况不尽相同,没能很准确地解决到问题,经过多次的尝试才自己得到结论,现在记录一下操作过程中遇到的问题……

1、目标是成功安装pnpm

$ **npm install pnpm -g**
$ **pnpm config set registry http://200.241.99.32:7001/**

这个过程需要先安装node,并确保node -v与npm -v能正常查询到版本
在这里插入图片描述
在安装目录下新建两个文件夹【node_global】和【node_cache】,同时,进行配置:

//设置全局模块安装路径
**npm config set prefix** "C:\Program Files\nodejs\node_global"
//设置全局缓存存放路径
**npm config set cache** "C:\Program Files\nodejs\node_cache"

这个全局文件在用户目录下:
在这里插入图片描述
其内容为:
在这里插入图片描述
在设置了之后一定要通过npm config get prefix确认这个全局的设置到底生没生效,比如下图就是没生效,然后后续整出来不少问题……
在这里插入图片描述

2、执行npm install -g pnpm,发现提示node_cache路径下缺了logs目录,手工创建一下,至于具体的xxx.log目录我没创建,在后续第5点中交代这个的处理方式
在这里插入图片描述

3、pnpm -v
出现pnpm不是内部或外部命令的问题,需要确认这个设置的路径到底对不对,上述install的时候明显不报错,那就是设置上存在的问题了。
默认状况下,我们在执行npm install -g XXXX时,下载了一个全局包,我们经过CMD指令npm root -g查看模块被下载到了哪里
在这里插入图片描述

4、npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果 包括路径,请确保路径正确,然后再试一次。
由于一些操作权限方面的考虑,直接用管理员身份打开windows powershell上执行pnpm的安装,npm install -g pnpm
在这里插入图片描述
此时node -v、npm -v、pnpm -v就都确认没问题了!
可以去到前端项目目录下处理正事了:pnpm install

5、在项目目录下查看npm -v,发现日志这个还存在权限问题
在这里插入图片描述
https://blog.csdn.net/qq_43102730/article/details/126265059
直接参考这个,为nodejs目录设置权限

6、回过头来记录一下自己在环境变量上的配置情况:
网上找到的环境变量配置的方式多种多样,我是自己在处理过程中综合尝试出来的,不确定有没有那个路径设置存在冗余,没有进一步花时间去测试……
①用户变量Path我设置了两个
在这里插入图片描述
②系统变量Path这里我设置了三个
在这里插入图片描述
7、npm install提示 xxx packages are looking for funding run npm fund for details的问题
首先这个不是报错,也可以通过设置给去掉这个提示。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【前端】node、npm、pnpm部署react项目过程中问题记录 的相关文章

  • 如何将React版本17降级到16?

    由于 React 17 不支持许多 React 包 如何将 React 版本从 17 降级到 16 假设您使用 npm yarn 或其他节点包管理器 依赖项版本列在package json 搜索react and react dom包下de
  • React Native - 跨屏幕传递数据

    我遇到了一些麻烦react native应用程序 我不知道如何跨屏幕传递数据 我意识到还有其他类似的问题在 SO 上得到了回答 但是这些解决方案对我来说不起作用 我正在使用StackNavigator 这是我的设置App js file e
  • React Native 反应导航 SafeArea 问题

    我更新了我的android项目 react navigation was 3 x 搬去5 x 决定实施必要的更改 但它不想工作 从反应导航页面复制了示例 但仍然显示相同的错误 有人知道问题出在哪里吗 当我用谷歌搜索一半的互联网时找不到解决方
  • 微前端架构中如何共享redux store?

    我正在尝试创建一个小项目来实现微前端架构 如下微前端 https martinfowler com articles micro frontends html文章 我正在为每个 MFE 微前端 创建多个存储库 并为该应用程序使用 Redux
  • Material-ui :从主题中提取颜色

    我想使用我的颜色material ui像这样的组件内的主题 const MyComponent props gt
  • Material-UI 4.8.1 API 更改 - 指定“组件”属性的新方法?

    Edit 这是 4 8 x 的打字错误 升级到 4 9 0 即可解决该问题 上版本4 8 0 以下代码编译并运行良好
  • 节点:以编程方式检查包的最新版本

    我希望我的节点包 在 npm 上发布 在新版本可用时提醒用户 如何以编程方式检查已发布软件包的最新版本并将其与当前版本进行比较 Thanks 您可以结合npmview https npmjs com package npmview 用于获取
  • 如何在 React js 上使用历史记录重定向到另一个页面?

    我在前端使用 Reactjs 并在后端使用 Laravel 开发了一个注册页面 我希望当我单击注册按钮时 它将被重定向到我的登录页面 我的注册组件是 handleSubmit event gt event preventDefault co
  • JSX 支持哪些 ES6 功能?

    我在用着与 JSX 进行反应 with 反应工具 https www npmjs com package react tools将 JSX 代码编译为 JavaScript JSX 支持哪些 ES6 功能harmony选项已启用 感谢康加克
  • 如果在状态中接收到相同的值,React 是否会重新渲染组件

    I am trying to check if I set the same value to state as it has previously does it re render the component or if it foun
  • 如何在 React JS 中根据键创建动态表?

    我正在尝试在 React JS 中创建一个动态表组件 该组件当前只有一个静态标头 其中包括最常见的结果键 有些结果还包含更多信息 例如电话号码 学位 如何根据键 值的存在动态地使用附加列扩展表 我应该与state并在存在时使其可见 或者我应
  • NPM 安装错误:解析“...nt-webpack-plugin”附近时 JSON 输入意外结束:“0”

    创建新的 Angular 5 项目时 节点版本 8 9 2 npm 版本 5 5 1 我的命令是 npm install g angular cli 错误是 npm ERR Unexpected end of JSON input whil
  • 重定向时重新初始化类

    我目前在http example com parentdir module 2 此 URL 实际上加载 Module js 类 如以下路由所示
  • 深层嵌套 Flexbox 布局是否会导致性能问题?

    我一直在开发一个 ReactJS 项目 其中我使用 Flexbox 布局创建了大部分组件 由于使用 React 我们可以拥有深度嵌套的组件 因此我的布局具有嵌套的 Flexbox 布局 现在我的问题是 这对性能有任何问题吗 在一个页面上 有
  • Azure Devops 反应脚本测试永远挂起

    我正在尝试在 Azure Dev Ops 中运行我的 React 应用程序的测试 但我不知道如何在测试运行后停止执行 它只是挂在那里 使管道永远处于运行模式 这是一个简单的 create react app 应用程序 有几个测试 以下是我的
  • React:搜索过滤器无法正常工作

    我通过 API 从服务器获取记录 API 是在 Loopback 中构建的 实际上 我在每个页面上显示 5 条记录 目前工作正常 我可以导航next or prev通过分页按钮 每页显示 5 条记录 问题是 当用户在搜索框中键入内容时 记录
  • 在非输入元素上反应 onKeyDown/onKeyUp 事件

    我需要捕获 cmd 按钮向上和向下事件 以便选择是否在 setState 中使用串联 例如 我如何在表元素上获取这些事件 您必须在主体 窗口级别捕获按键 表元素没有输入焦点 因此您无法从表中捕获键 没有输入元素 var cmdDown fa
  • 什么是 NPM?为什么需要它? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 以前 我用记事本制作了一些网站 所以我们必须创建一个文件夹 TREE 并在其中放入一个 htm 文件 以及一些文件夹 其中包含 Jav
  • npm3 如何决定安装扁平还是嵌套?

    我的项目依赖于 Angular2 beta 6 另一个项目依赖于 Angular2 beta 0 我的项目的 package json dependencies angular2 2 0 0 beta 6 another project 0
  • “submodule”似乎是一个 git 命令,但我们无法执行它

    我已经克隆了一个 git 存储库 它是一个 Angular 7 和 NET Core 应用程序 项目中一切正常 但是当我尝试恢复 npm 包时 出现以下错误 Microsoft TeamFoundation Team Explorer Gi

随机推荐

  • python随机生成验证码,数字+大小写字母

    ASCII码的对照链接 大写字母的十进制范围是 65 91 小写字母的十进制范围是 97 123 数字的十进制范围是 48 58 思路 1 先在空链表中添加大小写字母和数字 2 从列表中随机选择四个验证码 3 将列表转化成字符串输出 代码如
  • python 进行排序的两种方式 sort和sorted

    方法1 用List的成员函数sort进行排序 方法2 用内建函数sorted进行排序 sort函数定义 sort cmp None key None reverse False sorted函数定义 sorted iterable cmp
  • Cannot invoke “String.equalsIgnoreCase(String)“ because “code“ is null

    问题 同时开启多个项目 端口号不一致导致项目前后端错乱匹配 解决办法 后端 ruoyi admin下的application yml中的port 端口号 前端 vue config js里的port 端口号修改一致
  • cpp 解析HTML之 htmlcxx

    html与xml格式上比较相似 但xml不并一定能支持html的解析 这里介绍一个c 解析html的开源项目 htmlcxx 一 代码示例 1 项目源码下载之后 使用vs打开即可 默认为生成 lib静态库及MTd模式 可以在属性中修改指定为
  • httprunner测试框架3--har2case录制脚本

    har2case录制脚本 录制脚本 只是一个过渡 可以将录制的 har脚本快速转化成httprunner脚本文件 不能依靠录制 har2case可以将 har文件转化成yaml格式或者json格式的httprunner的脚本 可以借助fid
  • java代码kafka初始化producer和consumer

    目录 一 初始化producer对象 序列化消息 生产者发送消息的三种方式 kafka生产者其它详细知识 二 初始化consumer对象 反序列化消息 consumer取消订阅的方式consumer unsubscribe 使用自定义的序列
  • 回溯法解决地图填色问题

    目录 回溯法 最大度优先 最少可选颜色优先 向前探测 随机产生不同规模的图 分析算法效率与图规模的关系 四色 回溯法 回溯法的基本思想是采用递归和深度优先搜索的方法 尝试在一组可能的解中搜索出符合要求的解 在搜索过程中 若发现当前所选的方案
  • 颜色值不透明度对应表(0%-100%)

    不透明度 ps 可以理解为alpha 0 1的值
  • 腾讯大佬告诉你,写Python到底用什么IDE合适

    不管你是 Python 新手还是老鸟 肯定纠结过一个问题 到底用什么编辑器写 Python 代码好 为此 我们调查了数十位鹅厂程序猿们爱用的 Python IDE 从他们对每款编辑器的看法中 也许能给你一点启示 入门Python其实很容易
  • lzma sdk文件压缩与解压

    最新版的lzma sdk可以去SourceForge上面获取 具体地址为点击打开链接 7z官网点击打开链接 英文版 点击打开链接 中文版 我用lzma sdk主要是为了用来压缩和解压文件用的 其实适当的用法可以用来制作安装包 因为安装包也是
  • 在Linux的Ubuntu系统下安装QT及相关环境配置

    安装QT 从官网下载QT的安装包 在本地安装 本次使用的是Ubuntu18 06以及QT5 14 2 下文皆使用此版本作为示例 首先安装QT 具体操作如下 1 使用cd命令 cd home usr download 切换至安装包所在的目录下
  • Proteus仿真时数码管不能动态显示的问题及解决方法

    今天做Proteus仿真时遇到了数码管不能动态显示的问题 我的程序是用单片机P1口控制数码管段选 P2口低四位控制数码管位选 数码管1ms显示一位 全部刷新需要4ms 正常情况下人眼是感受不到这个速度下数码管的刷新过程的 所以他应该是这个样
  • 【图文解析 】Java中的Liu、继承、组合

    Alt Shift s 快捷键
  • Vue Element-ui el-table sortablejs 表格拖拽排序

    首先要在项目中本地安装 sortablejs 执行 npm install sortablejs save 然后在要实现表格拖拽的 vue文件中 引入 sortablejs import Sortable from sortablejs 基
  • PPPOE协议工作流程

    PPPoE Point to Point Protocol over Ethernet 基于以太网的点对点协议 的工作流程包含发现 Discovery 和会话 Session 两个阶段 发现阶段是无状态的 目的是获得PPPoE 终端 在局端
  • A5M2使用

    目录 一 修改语言 二 连接数据库 三 SQL相关 3 1 新建SQL 3 2 生成增删改查SQL 方式一 方式二 3 3 生成批量插入insert语句 3 4 生成DDL 3 5 SQL整形 3 6 SELECT 之后修改数据 3 7 生
  • 网络编程的无冕之王-Netty入门和核心组件介绍

    最近我在研究Netty 之前只是经常听说 并没有实际做过研究 为什么突然要好好研究一下它 主要是因为前段时间 我在看RocketMQ底层原理的时候发现它的底层的网络通信都是基于Netty 然后网上一查 果然 大家太多的耳熟能详的工具组件 都
  • 物理射线、导航网格寻路

    每日一句 努力追上你的每天都是美好的 因为未来可期 目录 射线检测 需求1 物体射线到一定距离会改变物体状态 降落伞 需求2 鼠标点哪走哪 寻路 射线 点击小地图 人物到达指定位置 需求3 做准心效果 射线碰到物体有UI跟随效果 寻路系统
  • C语言绘图EasyX图形库基础(笔记)

    在电脑已经安装了vs编译器的情况下在浏览器输入EasyX的官网网址http easyx cn下载EasyX图形库根据安装提示对应VS版本安装即可 EasyX cpp 此文件包含 main 函数 程序执行将在此处开始并结束 在电脑已经安装了v
  • 【前端】node、npm、pnpm部署react项目过程中问题记录

    最近在重新部署一个前后端分离的项目时 在前端环境这里遇到了一些麻烦 通过百度找到的node npm pnpm的处理情况不尽相同 没能很准确地解决到问题 经过多次的尝试才自己得到结论 现在记录一下操作过程中遇到的问题 1 目标是成功安装pnp