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

2016-05-03 13:43:35 +08:00
 Kamato

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 ~

10720 次点击
所在节点    前端开发
10 条回复
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
第一个很赞。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/275981

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX