V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 3112 天前的主题，其中的信息可能已经有所发展或是发生改变。

Vue-Echarts

自定义指令，实现在 Vue 应用中使用Echarts。

Demo

GitHub Repo

Vue-Pikaday

自定义指令，实现在 Vue 应用中使用Pikaday。

Demo

GitHub Repo

Vue-Remodal

自定义指令，实现在 Vue 应用中使用Remodal。

Demo

GitHub Repo

写在后面

Echarts 、 Remodal 和 Pikaday 是我在开发后台管理类网站时常用的三个第三方组件。我将它们以 Vue 指令的形式包裹起来以便于更好的在 Vue 应用中使用它们。如果你觉得这三个指令对你有点用处，欢迎提些建议或反馈 BUG ～

Vue

指令

GitHub

echarts

10 条回复 • 2016-08-22 17:28:36 +08:00

NemoAlex

2016-05-03 14:25:29 +08:00

赞赞赞，正好用到。
楼主继续分享不要停。

NemoAlex

2016-05-03 14:29:25 +08:00

咦？还没有提交到 NPM ？

NemoAlex

2016-05-03 14:30:47 +08:00

貌似 NPM 上 `Vue-Echarts` 已经被占坑狗占领，楼主需要换个名子提交了。

NemoAlex

2016-05-03 14:46:26 +08:00

建议完善一下 package.json ，提交到 NPM 上去
拿 vue-pikaday 举例：
加入
"main": "src/directives/pikaday.js"
把 "vue-router" 放到 "devDependencies" 里去

另外，是否可以参考 https://github.com/vuejs/vue-validator 的方式，只需要 Vue.use 初始化一下，就可以使用了呢？

Kamato

2016-05-03 15:02:05 +08:00

@NemoAlex
哈，谢谢支持。
我晚些时候把 package.json 整理一下，提交到 npm 去。
有个问题，把 vue-router 放到 devDependencies 里的目的是？

NemoAlex

2016-05-03 15:05:28 +08:00

@Kamato 这样别人 npm install 这个包，就不需要安装 vue-router ，毕竟 vue-router 只是 demo 才用吧？

Kamato

2016-05-03 15:08:33 +08:00

@NemoAlex 对哦～！

NemoAlex

2016-05-03 15:14:21 +08:00

另外建议把项目本身的代码，和 Demo 的代码分得清楚一些。
类似
/src 存放项目源码
/dist 存放编译（例如组合，压缩）后的项目源码
/example 存放示例
这种结构
在 package.json 里， files 指定 dist 目录就可以了，这样别人在 npm install 的时候可以不用下载其余的文件。

Kamato

2016-05-03 15:18:03 +08:00

@NemoAlex 有道理。因为之前没想过要发布到 NPM 上，所以没考虑这些问题。感谢～

itfanr

2016-08-22 17:28:36 +08:00

第一个很赞。

[简化 Vue.js 应用开发] 分享三个自定义指令，帮助你在 Vue 应用中集成 Echarts、Remodal 和 Pikaday

Vue-Echarts

Vue-Pikaday

Vue-Remodal

写在后面