当前位置: 首页 > news >正文

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

接下来在使用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.mrgr.cn/news/66934.html

相关文章:

  • 开发的角度认识一下防止模拟执行和反调试函数(RC4算法)
  • mysql约束和高级sql
  • 【三维重建】Semantic Gaussians:开放词汇的3DGS场景理解
  • 【CAP理论:概念、解释与应用】
  • 画动态爱心(Python-matplotlib)
  • Django的manage.py命令用法
  • element-plus table tableRowClassName 无效
  • 最新三维视觉下的扩散模型综述——Diffusion Models in 3D Vision: A Survey
  • windows10显示计算机设置,我的电脑,此电脑设置
  • 软媒市场自助发稿平台的优势解析
  • 怎样用云手机进行FB矩阵运营而不被封号?
  • 【Ag-Grid】 使用笔记 Vue3 + Vite(一)
  • Kafka自动生产消息软件(自动化测试Kafka)
  • gomarkdown漏洞CVE-2024-44337--手把手教你go-fuzz模糊测试引擎如何进行漏洞挖掘
  • Modbus解析流程全面升级:体验全新核心与终极优化!
  • SpringBoot中使用SpringTask实现定时任务
  • 设置Three.js响应式画布
  • Android RecyclerView ,使用ItemDecoration设置边距的大坑:左右边距不均匀/不同,已解决。
  • 【C++课程学习】:string的模拟实现
  • 防患于未然才是预警大屏的意义所在,看它是如何做的?