封装一个可拖拽的Tree组件（Vue），并上传到NPM

Github : https://github.com/shuiRong/v...
DEMO: https://vigilant-curran-d6fec...

---

有需求才有动力

一开始在新项目里用的Tree组件是Element的，但踩到坑了：Tree节点的填加/删除没法反映到data里，这个影响就比较大了。而后我经过一些奇技淫巧让节点的改变反映到了data里，虽然有点消耗性能（用了深克隆），但勉强算是解决了问题。

而后随着项目的进展，须要Tree节点可拖拽......

本着能用开源项目就不本身写的原则，我就去Gayhub上找适合的项目了。但很不幸运，虽然找到了不少不错的拖拽项目，但都不是我想要的。

无奈，只能本身写了。

快速了学习了HTML5的拖拽特性后，发现尤雨溪写了一个树形视图，正好能借鉴下。二者一结合，项目就成了。

嘿嘿

---

预览

---

快速开发

若是你决定了要作一件事，那就尽量地快点。好比作一个项目，注释，文档什么乱七八糟的均可之后来再加上，尽早写出来个Version 1.0 和一个能看的DEMO再说。

为何呢？

由于夜长梦多，时间久了什么事均可能发生。尽管对于Tree组件这种项目来讲，时机并无那么重要（比较重要的：项目质量，需求的知足度），但你也应该有这样的意识。

说些废话，项目无关，能够不看：

该作选择的时侯就要果断，“犹犹豫豫，顾忌不少”会让你大几率错失良机。或许你会说，难道不应考虑“×××”“×××”“×××”的状况吗？应该考虑，作选择时就应该考虑到全部相关可能出现的状况。
可是，你考虑的过久了！
我的以为考虑问题不该该带入情绪，它只会把你的注意力带到次要矛盾那里，而不是主要的。彻底这样思考问题，我还作不到，但在努力作的更好。

"当断不断，反受其乱"，最新看<<中国历朝通俗演义>>，感悟到的。

---

上传NPM

关于"Vue组件如何上传到NPM，供他人使用“，我一开始受到了一些相关博客的误导，大概就是webpack把项目打包成JS文件，而后在package.json的 main导出该JS文件。

我参考了不少文章和项目的代码，仍旧不能成功地在其余项目中引入。

最终，我灵光一闪，想到：为什么不直接在main里直接导出Vue组件（.vue文件）呢？

成功！

// 在项目根目录下登陆npm。首先，你须要有个npm账号
npm login
// ...根据提示输入用户名，密码
// ...上传。之后每次代码更新后均可以用这条命令从新上传。记得上传前更新下版本号。
npm publish

比较意外的是，上传了一天就有112次downloads了......看来，有这样需求的人还挺多呢。