测试平台常见前端问题-建议收藏备忘

接下来在使用Element UI开发测试平台前端的过程中,难免会碰到各式各样的问题,因此今天我们主要整理了以下几个常见的问题和解决方案,方便各位能轻松玩转测试平台前端:

  • Element UI更换主题颜色

  • 拉取github资源报错问题解决

  • nvm管理node.js版本

Element UI更换主题颜色

在实际的项目开发中使用Element UI时,默认的蓝色主题风格可能不符合我们的需要,手动去一个一个修改组件的颜色也非常麻烦,这个时候就需要直接更改项目的主题颜色风格。

但目前Element UI 官网的自定义主题颜色的网址已经无法使用了,访问直接报:服务不可用(503),一直也没修复,不知道是不是维护的工程师被开猿节流了……:

解决方案:

经过各种调研尝试,目前想要更换Element UI主题的话,只能手动搞了。

首先要有Element UI主题样式文件,可以从下面的地址下载:https://download.csdn.net/download/baidu_28340727/89095382

解压后里面有element-variables.scss、variables.scss两个文件:

将这两个文件copy到你项目工程根目录下的styles文件夹下,没有styles文件夹的话,就新建一个:

工程下的main.js文件中,注释掉之前默认的theme-chalk主题引用,然后再import element-variables.scss,参看下图标红部分的内容:

import variables from '@/styles/element-variables.scss'

然后,就可以通过直接修改element-variables.scss文件中的主题颜色,来使用不同的主题色了:

GitHub资源拉取报错

在实际项目使用中,我们package.json中的有些资源文件包要访问github去下载:

而使用npm install安装包时,可能会碰到github访问不通的问题,出现类似下面的报错:

图片

资源文件包如果拉取不下来,项目就运行不起来,出师未捷身先死~
 

解决方案:

从上面的报错信息里,我们可以看到,提示的是电脑上的git去访问github时访问不通。有时候是临时网络问题,多试几次,也许有一次就成功了。

如果试了多次都不成功,这个时候需要确保你的电脑已经开了代理,通过网页是能可以正常访问github的,假设代理端口号为:7890,然后给git设置使用代理:

 
  1. git config --global http.proxy http://127.0.0.1:7890

  2. git config --global https.proxy http://127.0.0.1:7890

图片

设置好之后,使用命令看看是不是设置成功了:

 
  1. git config --global --get http.proxy

  2. git config --global --get https.proxy

然后再次npm install安装包,应该就可以正常拉取到github的资源文件包了:

图片

后续在使用Git时如果不需要代理或者希望移除代理配置,可以使用以下命令:

 
  1. git config --global --unset http.proxy

  2. git config --global --unset https.proxy

nvm管理node.js的版本

在不同项目中,可能需要使用不同版本的Node.js,那么同一台电脑上,如何安装和管理不同版本的node.js版本呢?

解决方案:在 Windows 系统上,你可以使用 nvm 的 Windows 版本管理工具nvm-windows来轻松安装和管理不同的Node.js版本。

首先,打开 nvm-windows 的 GitHub 页面:https://github.com/coreybutler/nvm-windows/releases

在页面上的 “Assets” 部分,下载最新的 nvm-setup.exe 文件:

  

安装时:Set Node.js Symlink 这一步,选择你电脑上Node.js的安装目录,默认是:C:\Program Files\nodejs

  

如果电脑上之前已经安装有Node.js的版本,安装nvm时会提示是否希望使用NVM控制这个Node.js的版本,选择“是”:

  

完成安装后,打开一个新的命令提示符或 PowerShell 窗口,记得使用管理员身份打开,不然nvm install命令会提示没有权限。

运行下面的命令验证 nvm 是否成功安装,如果你看到了 nvm 的版本号,则表示安装成功:

nvm version

  

接下来,你可以使用 nvm 来安装和管理 Node.js 版本。例如,运行以下命令来安装最新版本的 Node.js:

nvm install latest

  

也可以安装特定版本的 Node.js。例如,运行以下命令来安装 Node.js v14

nvm install 14

使用下面的命令,列出你电脑上安装的node.js的所有版本,*号标记的表示目前使用的版本:

nvm list

图片

想要切换到使用node.js 21.7.2版本,使用命令:

nvm use 21.7.2

  

好啦,以上就是本次的全部内容,如果对你有帮助,麻烦点赞+分享,你的支持就是作者更新最大的动力!

 

感谢每一个认真阅读我文章的人,礼尚往来总是要有的,虽然不是什么很值钱的东西,如果你用得到的话可以直接拿走:

这些资料,对于【软件测试】的朋友来说应该是最全面最完整的备战仓库,这个仓库也陪伴上万个测试工程师们走过最艰难的路程,希望也能帮助到你!有需要的小伙伴可以点击下方小卡片领取   

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

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

相关文章

NC313 两个数组的交集

NC313 两个数组的交集 添加链接描述 import java.util.*;public class Solution {/*** 代码中的类名、方法名、参数名已经指定,请勿修改,直接返回方法规定的值即可** * param nums1 int整型ArrayList * param nums2 int整型ArrayList * return int整型A…

[C++刷题] 基础小知识点(4) abs() exp() 和 输入验证

分析题目, 大多数都是常规操作, 较为特殊的有: 程序需有一定的容错性, 当用户输入非法字符时, 提示用户重新输入。绝对值的实现e^x的实现 首先是 第一点 这里通过cin.fail()流判断是否合法 cin.fail()来判断当前的输入的类型和预期的是否相同,如不同cin.fail()返回…

【大数据学习 | HBASE】hbase的整体架构

hbase的region存储原理图 首先我们看到hbase的组成分为两个大的部分,分别是hmaster和hregionserver,主节点用于协调数据,regionserver用于真正的去管理表,其中regionserver存在多个,他们共同协调管理全有的表&#xff…

民间故事悬疑恐怖故事图片素材哪里找|巨日禄AI|短视频|自媒体

民间故事是中华文化中不可或缺的一部分。近一年制作与分享民间故事短视频深受创作者喜欢,并且这类故事对于普通民众粘性很高,通常点赞评论都很高。对于这类民间故事、中国传统故事、悬疑恐怖故事的文案创作借助短视频平台的高赞文案选题以及大语言模型的…

如何将VMware ESXi中的虚拟机迁移到Workstation

我们前面介绍了如何将VMware workstation中的虚拟机迁移到ESXi中(将OpenWrt 23.05.3部署到VMware ESXi),那怎么将ESXi中的虚拟机迁移到workstation中呢? 首先,我们回顾一下,在将workstation中的虚拟机迁移到…

Linux操作系统开机引导

linux操作系统的开机引导的过程 linux操作系统开机流程图 1、开机自检:根据bios的设置,对cpu、内存、显卡、键盘等设备进行初步检测,如果以上检测设备正常工作,系统会把控制权移交到硬盘 总结:检测包含系统启动操作系…

微信小程序开发,诗词鉴赏app(一)

微信小程序开发,诗词鉴赏app(一): https://blog.csdn.net/jky_yihuangxing/article/details/143501681微信小程序开发,诗词鉴赏app,诗词推荐实现(二):https://blog.csdn.net/jky_yih…

阅读笔记 Contemporary strategy analysis Chapter 15

来源:Robert M. Grant - Contemporary strategy analysis (2018) Chapter 15 Current Trends in Strategic Management Ⅰ Introduction 2018年,商业世界正受到不可预测的力量重塑,包括人工智能的广泛应用、民族主义兴起、国际机构的衰退以…

想唱就唱 2.15.63| 电视免VIP唱K软件,支持手机点歌

想唱就唱是一款实用性强的K歌软件,支持歌曲搜索、歌手搜索及排行榜。软件支持歌曲下载、点歌、插队,还支持手机扫码点歌,功能与KTV软件一致,让用户在家也能享受KTV体验。首次加载较慢,因采用先下载后播放方式。会员版已…

【UE5】一种老派的假反射做法,可以用于移动端,或对反射的速度、清晰度有需求的地方

没想到大家这篇文章呼声还挺高 这篇文章是对它的详细实现,建议在阅读本篇之前,先浏览一下前面的文章,以便更好地理解和掌握内容。 这种老派的假反射技术,适合用于移动端或对反射效果的速度和清晰度有较高要求的场合。该技术通过一…

简单的ATM提款机案例

要求&#xff1a; 代码&#xff1a; <!DOCTYPE html> <html><head><meta charset"utf-8" /><title></title></head><body></body> <script>use striclet money100//想要money不重置要放循环外while(tr…

linux perf 环境部署和基本测试(基于Ubuntu20.04)

1,linux 安装perf sudo apt-ge install linux-tools-common sudo apt-get install linux-tools-$(uname -r) linux-tools-generic -y 2 补充安装 sudo apt-get install python3-q-text-as-data 3&#xff0c;perf常用命令 larkubuntu:~$ perf usage: perf [--version] [--hel…

基于FPGA的图像双线性插值算法verilog实现,包括tb测试文件和MATLAB辅助验证

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 (完整程序运行后无水印) 这里实现的是256*256双线性插值到512*512的系统模块 局部放大&#xff1a; 将数据导入到matlab&#xff0c;得到插值效果…

SMBIOS基础

一、INTRODUCTION The System Management BIOS&#xff08;SMBIOS&#xff09;解决了主板和系统供应商如何通过平台固件以标准格式展现其产品信息&#xff0c;这些信息包括CPU/Memory的serial number、manufacture、speed等资料&#xff0c;也有PCIe Devices、USB Device、Red…

网易数据中台实践:高效管理与成本优化的秘密

文章目录 一、数据中台概览二、元数据中心三、数据服务四、全链路数据质量中心五、数据资产管理六、数据中台实施效果 网易通过建立一套统一的数据架构与平台&#xff0c;成功实现了数据的高效管理与应用。剖析网易在互联网产品数据管理工作中的经验与做法&#xff0c;涵盖从数…

蓝桥杯真题——三角回文数(C语言)

问题描述 对于正整数 n, 如果存在正整数 k 使得 n123⋯kk(k1)2n123⋯kk(k1)/2​, 则 n 称为三角数。例如, 66066 是一个三角数, 因为 66066123⋯36366066123⋯363 。 如果一个整数从左到右读出所有数位上的数字, 与从右到左读出所有数位 上的数字是一样的, 则称这个数为回文数…

Spark SQL大数据分析快速上手-DataFrame应用体验

【图书介绍】《Spark SQL大数据分析快速上手》-CSDN博客 《Spark SQL大数据分析快速上手》【摘要 书评 试读】- 京东图书 大数据与数据分析_夏天又到了的博客-CSDN博客 本节主要介绍如何使用DataFrame进行编程。 4.1.1 SparkSession 在旧版本中&#xff0c;Spark SQL提供…

磁盘的分区

硬盘管理 硬盘的概念 硬盘是一种计算机的存储设备&#xff0c;通常是由一个或多个磁性盘片组成。硬盘既可以安装在计算机的内部&#xff0c;也可以外接计算机 硬盘主要是用来保存数据的 数据包括&#xff1a;操作系统&#xff0c;应用程序&#xff0c;文档多媒体文件等等 计算…

IEEE TRO综述论文:抓取合成领域的深度学习方法

TRANSACTIONS ON ROBOTICS综述论文&#xff1a;抓取合成领域的深度学习方法抓取是机器人在现实世界中操纵物体的基本技能之一&#xff0c;涉及在一组接触点上施加力和扭矩来控制物体的运动&#xff0c;而近些年深度学习方法的突破性研究使机器人在抓取方面取得了快速进展。近期…

旋转位置编码

1. Transformer为什么需要位置编码 因为 transformer 结构本身是和位置编码无关的&#xff1a; Y T ( X ) F ( A ( X ) ) Y\Tau(X)F(A(X)) YT(X)F(A(X))&#xff0c;其中 A ( ) A() A() 是 attention 变换&#xff0c;只进行了矩阵变换&#xff0c;跟位置无关&#xff0c; …