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

【测试平台】【前端VUE】工具页面学习记录

背景:

这个我4年半以前刚接手记录,测试工具页面一般比较简单,不需要复杂东西,剩下就是维护。

工程安装

npm install

1.执行nmp install前先确认一下自己的node版本,这个项目需要是node12才可以,否则会出现各种报错

2.查看node版本 node -v

3.安装好node之后,再执行sudo npm install命令

4.如果遇到报错连接板不上git的报错信息.

  1. 执行命令git config --global url."https://".insteadOf git://
  2. 然后在执行npm install

工程启动

构建新页面

添加侧边栏-一级菜单

/src/router/index.js

添加侧边栏-二级菜单

src/router/modules/servicesuser.js

添加逻辑层

src/api/servicesuser.js

添加请求接口

src/api/servicesuser.js

相关报错解决

1.Npm 安装时候报错

https://github.com/PanJiaChen/vue-element-admin/issues/3859

2.本地Mac启动前端程序报js-pinyin错误

➜  LiveMeHydra git:(master) ✗ npm run dev

> vue-element-admin@4.2.1 dev /Users/Amei/Liveme/Git/LiveMeHydra
> vue-cli-service serve

 INFO  Starting development server...
 WARN  A new version of sass-loader is available. Please upgrade for best experience.
 98% after emitting CopyPlugin                                                      

 ERROR  Failed to compile with 1 errors                                                                                                                                                           3:46:19 PM

This dependency was not found:

* js-pinyin in ./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/versions/testplan.vue?vue&type=script&lang=js&

To install it, you can run: npm install --save js-pinyin

解决方案:

这个错误提示表明在编译 testplan.vue 文件时,缺少 js-pinyin 依赖项。为了解决这个问题,你可以运行以下命令安装 js-pinyin 依赖项

npm install --save js-pinyin

这个命令将会安装 js-pinyin 依赖项并将其添加到 package.json 文件中的 dependencies 列表中。安装完成后,你可以重新编译 testplan.vue 文件并检查是否仍然存在缺少依赖项的错误.

相关学习资料

element-ui

https://element.eleme.cn/#/zh-CN/component/installation

https://element.eleme.cn/#/zh-CN/theme/preview

vue-element-admin

演示地址:vue-element-admin

官方文档:https://panjiachen.github.io/vue-element-admin-site/zh/guide/#%E5%8A%9F%E8%83%BD

代码github:https://github.com/PanJiaChen/vue-element-admin


http://www.kler.cn/a/373817.html

相关文章:

  • Java迭代器:深入理解与应用
  • java设计模式之创建者模式(5种)
  • Oracle 开窗函数
  • AI代币是什么?AI与Web3结合的未来方向在哪里?
  • ELK之路第四步——整合!打通任督二脉
  • Oracle视频基础1.1.4练习
  • SSH登录介绍
  • 1024·工作流智能体挑战赛结果出炉
  • JavaScript闭包(Closure)详解与应用实例
  • 财经领域波澜现,茅台价格动心弦。供需关系新篇章,高端白酒市场寒。经济转型消费变,电商大促供需悬。经济压力需求减,理性消费新风传。
  • 智能视频多语言AI配音/翻译工具
  • Java项目实战II基于微信小程序的马拉松报名系统(开发文档+数据库+源码)
  • 【ArcGISPro】宣布推出适用于 ArcGIS 的 AI 助手
  • 51c深度学习~合集6
  • 【系统设计】探索数据库的世界:轻松掌握基本原理
  • 初识字节码文件--Java
  • 【C#】搭建环境之CSharp+OpenCV
  • 树莓派基础设置--1.更新和升级操作系统
  • 文件中台与安全:集成方案的探索与实践
  • REST APIs与微服务:关键差异
  • dicom基础:乳腺影像方位信息介绍
  • ubuntu交叉编译dbus库给arm平台使用
  • 运用通义灵码有效管理遗留代码:提升代码质量与可维护性
  • chrome商店下载的插件转crx安装包
  • openpnp - 手工修改配置文件(元件高度,size,吸嘴)
  • 应用层知识点总结1