如何从0开发一个Atom组件】的更多相关文章

最近用Atom写博客比较多,然后发现一个很严重的问题..没有一个我想要的上传图片的方式,比如某乎上边就可以直接copy/paste文件,然后进行上传.然而在Atom上没有找到类似的插件,最接近的一个,也还是需要手动选择文件,然后进行上传.这个操作流程太繁琐,索性自己写一个插件用好了. 成品插件下载地址:https://atom.io/packages/atom-image-uploader 规划 首先,我们确定了需求,要通过可以直接copy文件,然后在Atom中paste即可完成上传的操作.确定…
1.新建文件夹在终端打开执行 npm init -y 生成package.json如下,注意如果要发布到npm,name不能有下划线,大写字母等 { "name": "vuecomponentdi", "version": "1.0.0", "description": "", "main": "index.js", "scripts&q…
Jcrop是一款优秀的裁剪工具,它不仅可以裁剪图像,还可以裁剪canvas及任何的div元素,具体可参考: http://code.ciaoca.com/jquery/jcrop/ 基于Jcrop,开发一个js组件(Cut.js),使之可进行复用: (function(jQuery,window,undefined){     window.Cut = window.Cut || {};     var _default={         boxWidth:0,         boxHeig…
Step1: 安装kissy gallery组件工具 npm install yo grunt-cli -g npm install generator-kissy-gallery -g 请确保本地带有NodeJs和Npm环境. Step2:创建组件目录 手动创建一个组件目录,比如offline. 进入该目录,打开命令行工具,执行如下命令: yo kissy-gallery 1.0 1.0为组件起始版本目录,可以自由设置. 工具会询问您组件的作者和email,这是必须输入的: 构建成功后的目录如…
分页组件在项目中经常要用到之前一直都是在网上找些jq的控件来用(逃..),最近几个项目用上vue了项目又刚好需要一个分页的功能.于是百度发现几篇文章介绍的实在方式有点复杂, 没耐心看自己动手造轮子写了一个,用vue的计算属性去实现真正的逻辑代码大约在20行左右相当好理解现实原理简单没什么好介绍的直接上代码. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo…
本实例演示了实现一个滚动条基本功能的制作方法,没有添加改变皮肤,修改滚动条视框大小等功能,有兴趣的朋友可根据自己要求自行添加.使用时只需要通过以下一行代码创建滚动条组件: var myScrollbar:Scrollbar=new Scrollbar(mc); addChild(myScrollbar); 其中mc为需要添加滚动条功能的元件,如影片剪辑,文本等. 一.制作元件 滚动条由滑块slider,向上向下滚动的按钮,滚动条背景,遮挡内容的遮罩及存储内容的contMc元素组成.当拖动滑块sl…
本实例演示了实现一个滚动条基本功能的制作方法,没有添加改变皮肤,修改滚动条视框大小等功能,有兴趣的朋友可根据自己要求自行添加.使用时只需要通过以下一行代码创建滚动条组件: var myScrollbar:Scrollbar=new Scrollbar(mc); addChild(myScrollbar); 其中mc为需要添加滚动条功能的元件,如影片剪辑,文本等. 一.制作元件 滚动条由滑块slider,向上向下滚动的按钮,滚动条背景,遮挡内容的遮罩及存储内容的contMc元素组成.当拖动滑块sl…
自己写的组件 有的也挺好的,为了方便以后用自己再用或者给别人用,把组件打包发布到npm是最好不过了,本次打包支持 支持正常的组件调用方式,也支持Vue.use, 也可以直接引用打包好的js文件, 配合vue.js 就不需要webpakc这种构建工具了,可以直接在页面内使用,下面以 ‘yyl-npm-practice’ 这个包为例 第一步:使用 vue init webpack-simple yyl-npm-practice   初始化项目 提示: 不要用 vue init webpack npm…
导入自定义组件时出现了如下错误 ERROR Failed to compile with 1 errors 12:35:41 This dependency was not found: * components/star/star in ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?ty pe=script&index=0!./src/components/header/header.vue To install it, you can…
Atom组件 最近用Atom写博客比较多,然后发现一个很严重的问题.. 没有一个我想要的上传图片的方式,比如某乎上边就可以直接copy/paste文件,然后进行上传. 然而在Atom上没有找到类似的插件,最接近的一个,也还是需要手动选择文件,然后进行上传. 这个操作流程太繁琐,索性自己写一个插件用好了. 成品插件下载地址:https://atom.io/packages/atom-image-uploader 规划 首先,我们确定了需求,要通过可以直接copy文件,然后在Atom中paste即可…