前言????

  • 本文主要解决了如何在​​node_modules​​中第三方模块的修改使用
  • 如果可以的话发布一个新的轮子来使用
  • 在解决的过程中也遇到了许多的问题以此来记录一下

需求安排????️

  • 风和日丽的一天,需求找到我让我给客户的系统做一个类似​​yapi​​的接口管理

为了方便,我改了别人的轮子_封装

为了方便,我改了别人的轮子_封装_02

  • 大致看了下对于预览和编辑就是两个切换tab配合一些表单和表格
  • 其中可能难搞的应该是这个json和jsonschema的转化了

为了方便,我改了别人的轮子_造轮子_03 目前有两个方案

1. 自己手写一个(时间久)
2. 参考社区大佬的轮子来做修改使用(可能不完全符合)
  • 对于这种有复杂数据结构和互相影响的交互场景非常之多的情况
  • 还要统一组件之间的样式和适配,对于摸鱼选手的我短时间大概率是做不出来的
  • 巧了!在网上找到一位大佬写的​​json-schema-editor-vue​​刚好符合基本的功能,除了样式其他大致功能都是符合的
  • 于是乎也没想这么多直接开干????

成品效果

为了方便,我改了别人的轮子_Node.js_04为了方便,我改了别人的轮子_json_05

奇怪的需求增加了????

  • 第二天早上起床就感觉右眼不舒服一直在间断的跳动
  • 果不其然之前的担心还是来了,需求找到我说你这个不行呀改了标题没有效果呀

为了方便,我改了别人的轮子_json_06

  • 把编辑的接口参数进行打印发现这个标题传的参数是​​title​​​ 而后端要接受的是​​description​
  • 这时我就知道麻烦来了如果这里要显示备注然后代表的参数是​​description​​的话那我需要改源码
  • 可是这是别的大佬写的轮子我有什么办法更改呢?
  • 现在就是需要将标题两个字改成备注,把​​title​​​改成​​description​

目前有两个方案

1. 直接修改`node_modules`包里的`js`文件把其中需要改的给改了(包里全是压缩文件不好改)
2. 找到这个轮子的源码修改并发布一个新轮子(没有尝试过造轮子)
  • 当我找到​​node_modules​​的对应包文件,我直接否决了第一种方案,里面全是压缩后的js根本不好改,即使这个简单的需求改好了以后万一还有其他复杂需求就没办法解决了,更何况如果改了这里的文件,每次下载依赖的时候都要手动改一遍,太不实际了,更别说之后要做自动化部署了。

尝试改轮子????️

  • 我寻思着我之前也没造过轮子也没发布过​​npm​​包不如趁这个机会学习一下
  • 上网查阅资料后发现,其实上传一个轮子也不难,难的是做一个好的轮子出来
  • 打开之前​​json-schema-editor-vue​​​的​​github​​​地址把源码​​clone​​下来研究
  • 打开源码之后就是熟悉cli的感觉,很快啊找到对应的文件进行组件修改????
  • 修改后对应着​​齐齐​​​的​​npm​​​配置尝试发布一个​​npm​​包

发布成功✈️

  • 把配置都修改完成

为了方便,我改了别人的轮子_造轮子_07

  • 运行​​npm run lib​​成功打包生成压缩版的文件

为了方便,我改了别人的轮子_Node.js_08

  • 注册一个​​npm​​账号并登陆

为了方便,我改了别人的轮子_前端_09

  • 成功发布​​npm​

为了方便,我改了别人的轮子_前端_10

  • 在官网的账号里也查的到上传的轮子

为了方便,我改了别人的轮子_前端_11

  • 这样一来所有的准备都结束了,接下来只需要在自己的项目中下载自己的轮子进行使用就好了~~

成品效果

为了方便,我改了别人的轮子_前端_12

写在最后????

  • 为了想让自己巩固一下于是写下了这篇文章,但是好像写着写着又变成流水账了哈哈哈????
  • 但是没有关系至少我是有收获的,之前没有接触过造轮子一直都感觉造轮子的人都很厉害
  • 这次真正看了大佬的轮子源码后发现有很多优秀的习惯和封装都值得自己去学习
  • 发布轮子不难但是真正用心做一个轮子的老哥们都很厉害这也是我要去学习的,希望有一天我也可以做出很合理的封装很合理的组件化????
  • 如果您觉得这篇文章有帮助到您的的话不妨点赞支持一下哟~~????