百度脑图 kityMinder 二次开发

使用百度脑图kityMinder封装为组件引用

1、支持节点操作：新增、删除、标记、复制、粘贴

2、支持用例操作：TP节点支持新建用例

3、修改操作栏样式

 

  代码仓库：https://github.com/sjbhz/testcase-factor-minder-editor.git

  本组件为[vue-testcase-minder-editor](https://github.com/chenhengjie123/vue-testcase-minder-editor)基础上再次进行二次开发

 

 

 

 一些说明：

项目修改的功能点可在ReadMe中查看；
此外关于项目的 启动与打包 特加此说明：
 1、testcase-factor-minder-editor：
     ·安装依赖 npm --registry=https://registry.npm.taobao.org install
     ·本地运行 npm run lib && npm run serve  ( 若终端不识别&&， 需分开执行本指令 )
     （如有修改代码需重新进行npm run lib，再执行npm run serve） （在git bash 终端运行即可，在vscode的teminal中运行可能报错）
     ·发布到npm中，第三方平台可直接npm install进行调用
     
     demo文件位置：testcase-factor-minder-editor/example/App.vue
     
 2、kityminder-core：
     ·安装依赖 bower install ( 在bower.json所在目录安装 )
     ·安装依赖 npm install ( 上面装了之后这一步可省略 ？)
     ·本地运行 npm run dev
     ·打包 npm run build     

     demo文件位置：testcase-factor-minder-editor/kityminder-core/dev.html
     
 3、hotbox:
     ·安装依赖 bower install ( 在bower.json所在目录安装 )
     ·再引入testcase-factor-minder-editor/hotbox/bower_components/sea.js  （在 https://github.com/linwalker/seajs-demo 可找到sea.js文件 ）  
     ·打包：grunt  （ 在testcase-factor-minder-editor/hotbox/less下的文件进行修改样式，修改完之后依据Gruntfile.js 文件 ）        
     
    demo文件位置：testcase-factor-minder-editor/hotbox/demo.html ( 直接open in browser )
    
补充：
    可以将hotbox中生成的hotbox.css引入到testcase-factor-minder-editor中，
    但是这个项目中在 testcase-factor-minder-editor/packages/VueTestcaseMinderEditor/src/style/hotbox.scss进行重写了
    
    
百度脑图：
    https://github.com/fex-team/kityminder-core
    
    
另补充一些脑图调研成果：
    1、https://github.com/wanglin2/mind-map 
       https://juejin.cn/post/7257922419319406648?searchId=202308231349252BD2D382249D89188153
    2、https://gitee.com/Erised12345/vue-minder 
    3、https://github.com/huangyuanyin/hyy-vue3-mindMap
    4、华为云脑图（不开源）：https://zhuanlan.zhihu.com/p/641166417
    5、https://github.com/ssshooter/mind-elixir-core
    
百度脑图的一些讨论与二开：
    https://juejin.cn/post/7083049605381750798
    https://juejin.cn/post/6844903616180912136#heading-10
    https://juejin.cn/post/7000642617193021447#heading-0
    https://juejin.cn/post/7083049605381750798
    https://juejin.cn/post/6969537299533021220
    
    https://blog.csdn.net/qq_51118755/article/details/131373580
    https://blog.csdn.net/ZMJ_QQ/article/details/128654137?spm=1001.2101.3001.6650.10&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-10-128654137-blog-131373580.235%5Ev38%5Epc_relevant_anti_vip&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-10-128654137-blog-131373580.235%5Ev38%5Epc_relevant_anti_vip&utm_relevant_index=11
    https://blog.csdn.net/ZMJ_QQ/article/details/129046188?spm=1001.2014.3001.5502
    https://blog.csdn.net/ZMJ_QQ/article/details/129059492?spm=1001.2014.3001.5502
    https://blog.csdn.net/ZMJ_QQ/article/details/130574363?spm=1001.2101.3001.6650.6&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-6-130574363-blog-129059492.235%5Ev38%5Epc_relevant_anti_vip&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-6-130574363-blog-129059492.235%5Ev38%5Epc_relevant_anti_vip&utm_relevant_index=13
    https://blog.csdn.net/ZMJ_QQ/article/details/129305294?spm=1001.2101.3001.6650.16&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-129305294-blog-70822134.235%5Ev38%5Epc_relevant_anti_vip&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7ERate-16-129305294-blog-70822134.235%5Ev38%5Epc_relevant_anti_vip&utm_relevant_index=19
    
    
npm发包与版本升级
    https://juejin.cn/post/7018227151094677511
    https://blog.csdn.net/u010059669/article/details/109715342
    
grunt使用指南
    https://www.jianshu.com/p/6926f15feb20
    https://www.gruntjs.cn/using-the-cli
    
bower使用
    https://bower.io/#install-bower