深入理解webpack的require.context

2019-07-26
阅读 7 分钟
9.3k
而这个 api 主要为我们做什么样的事情?它可以帮助我们动态加载我们想要的文件,非常灵活和强大(可递归目录)。可以做 import 做不到的事情。今天就带大家一起来分析一下,webpack 的 require.context是如何实现的。

React应该如何优雅的绑定事件?

2019-01-02
阅读 4 分钟
4.8k
由于JS的灵活性,我们在React中其实有很多种绑定事件的方式,然而,其实有许多我们常见的事件绑定,其实并不是高效的。所以本文想给大家介绍一下React绑定事件的正确姿势。

五分钟 Styled-components 高级实用技巧

2018-09-03
阅读 4 分钟
8.5k
回到2013年,React凭空出世。但是在那时,我们会想,oh shit! 我们好不容易分离了HTML/CSS/JS, 为什么出现了JSX,我们又需要把HTML和JS耦合在一起?React 创造了 HTML in JS. 在React中,我们知道,一切即组件。那既然HTML能在js里写,为什么我们不把CSS也一起写呢?这样不才是一个真正的组件吗?

如何造一个『为移动端而生』的日历

2017-07-03
阅读 7 分钟
11.7k
之前写了一篇Calendar -『为移动端而生』的自定义日历,一直有童鞋对这个插件的手势处理存在一些问题,所以想写篇文章,来说说它的成长史~ 在阅读本文之前,确保你有稍微看过 calendar 的效果 喔~ 点击查看github, 查看calendar源码 也可以在 NPM上搜索 mob-calendar 找到它。 一、 确认需求 想做一个日历最主要的原因...

Calendar -『为移动端而生』的自定义日历

2017-05-29
阅读 4 分钟
11.6k
Calendar was born for several product requirements in the mobile. It’s free, cute and customized.

Webpack2 的无脑友好错误提示工具

2017-03-01
阅读 1 分钟
3.1k
你只需要一行就可以实现hot-reload和友好的错误提示 new WebpackBrowserLog(webpackConfig) 这里有张gif的效果图,请等待 平时我们都在浏览器的console面板里看错误,或者是在命令行里看错误真是太累了!浏览器直接显示错误极大的提升了开发的效率! 不久前研究webpack2,顺便产出了一个这样的小工具。好吧,其实很早以...

毫无色彩的二哲和他的巡礼之年

2017-02-05
阅读 4 分钟
3.3k
15年9月大三休学创业,16年9月重新复学大三 在2016年4月顺利引进天使轮,公司从厦门集美区搬到了深圳南山区 16年底,我们正在准备接入A轮

少踩点坑,你值得知道的React事件绑定

2016-12-22
阅读 8 分钟
5.5k
项目使用框架版本主要有 react(15.4.1) + react-dom(15.4.1) + webpack(1.13.3) + axios(0.15.3) + node(6.2.2), 点击查看项目简介:一段人人都应该知道的从 vue 到 react 的过渡史

一段人人都应该知道的从Vue到React的过渡史

2016-12-22
阅读 10 分钟
6.8k
项目使用框架版本主要有 react(15.4.1) + react-dom(15.4.1) + webpack(1.13.3) + axios(0.15.3) + node(6.2.2), 详情具体可见下文的【环境配置】

推荐五个Vue2的免费教程

2016-12-12
阅读 1 分钟
9.9k
Jeffrey Way一直都有发布他web开发的教程。他曾经在30天内教会了我使用jquery。在Laracasts上有他免费的VueJs教程,并且宣称是“世上最深入的vuejs系列”。在你学习完本课程后,你将不需要再去操作DOM,如果你操作了DOM,在你的脑中会听见Jeffrey警告你不要这样去做。

如何造一个移动端的联动选择器(四)

2016-12-03
阅读 2 分钟
2.9k
写在前面 之前写了一篇 MultiPicker -『为移动端而生』的自定义多级联动选择器,得到了很多人的关注。鉴于很多人对这种手写插件的过程很好奇,所以写了几篇文章,来说说它的成长史~ 在阅读本文之前,确保你有稍微看过 MultiPicker 的源码 喔~ 点击查看源码 ,也可以在 npm 上找到他们: 日期选择器 - DateSelector - NPM...

如何造一个移动端的联动选择器(二)

2016-12-02
阅读 3 分钟
2.5k
写在前面 之前写了一篇 MultiPicker -『为移动端而生』的自定义多级联动选择器,得到了很多人的关注。鉴于很多人对这种手写插件的过程很好奇,所以写了几篇文章,来说说它的成长史~ 在阅读本文之前,确保你有稍微看过 MultiPicker 的源码 喔~ 点击查看源码 ,也可以在 npm 上找到他们: 日期选择器 - DateSelector - NPM...

如何造一个移动端的联动选择器(三)

2016-12-02
阅读 3 分钟
2.8k
写在前面 之前写了一篇 MultiPicker -『为移动端而生』的自定义多级联动选择器,得到了很多人的关注。鉴于很多人对这种手写插件的过程很好奇,所以写了几篇文章,来说说它的成长史~ 在阅读本文之前,确保你有稍微看过 MultiPicker 的源码 喔~ 点击查看源码 ,也可以在 npm 上找到他们: 日期选择器 - DateSelector - NPM...

如何造一个移动端的联动选择器(一)

2016-12-01
阅读 2 分钟
5.4k
写在前面 之前写了一篇 MultiPicker -『为移动端而生』的自定义多级联动选择器,得到了很多人的关注。鉴于很多人对这种手写插件的过程很好奇,所以写了几篇文章,来说说它的成长史~ 在阅读本文之前,确保你有稍微看过 MultiPicker 的源码 喔~ 点击查看源码 ,也可以在 npm 上找到他们: 日期选择器 - DateSelector - NPM...

vue自定义指令升级2.0的坑

2016-11-28
阅读 2 分钟
10k
从1.0.X版本就开始使用vue了,应该也是vue很早的一批用户。在我司使用vue这一年多以来(偏向移动端),我发现vue的插件真的是少之又少,这也是我当初一开始想写v-tap指令插件的初衷。 如今vue升级2.0后,在自定义指令部分的API全部变化了!对于一个插件作者来说这简直是崩溃的!毫无兼容可言。本文我就讲介绍下一个自定...

『为移动端而生』的自定义多级联动选择器

2016-11-14
阅读 1 分钟
18.5k
MultiPicker - 自我介绍 MultiPicker是为了满足移动端对各种选择器的需求而生的,兼容性强,灵活度高。目前已有 几十万 的实际用户正在使用。 MultiPicker主要是由两个部分组成, 一个部分是 日期选择器 - DateSelector 另一个部分是 自定义json选择器 - MultiPicker 日期选择器有两种样式,一种带tab的固定样式,另一种...

为小程序而生的小(jiao)手架

2016-09-26
阅读 3 分钟
11.6k
不久前我们一直所期待的应(xiao)用(cheng)号(xu)终于诞生了,但微信制造了一系列的封闭环境,在内测版中,我们看见了开发其实是十分不便利的。为了能提升咱们的工作效率,小手架由此而生 --- wxapp

WebPack在单页项目中的探索

2016-04-22
阅读 2 分钟
2.4k
前言 之前介绍了 webpack在多页项目中的探索那篇有极大得不住,还有极大得改善空间,并不完美,不建议用在生产环境,其实是现在不想去优化,懒 :) thinkjs + vue + vueRouter + webpack 的 SPA配置 (其实可以看我的一个repo thinkjs+vue的单页blog尝试 ) 目录介绍 由于后台使用了 thinkjs 框架的ES6模式 src 为后台编写...

教你如何预判用户手势行为

2016-03-04
阅读 2 分钟
2.7k
有的安卓有个bug,不阻止浏览器默认行为,就无法实时触发move。那如果阻止了浏览器默认行为,当我手指在日历这块区域内,就没法触发浏览器上下滑动。

WebPack在多页应用项目中的探索

2016-01-30
阅读 6 分钟
5.7k
1.我所想要的是每一个业务需求模块下(source/index)会有很多页面 每一个页面都是一个文件夹(source/index/index,source/index/topics) 2.项目无需后台环境浏览器可以直接打开访问 3.每个页面资源如.sass文件,.js文件等就近维护,用.vue + es6的形式进行组件模块化的开发 4.开发时拥有良好的sourseMap调试 5.当我们不需要...

vue自定义指令实现v-tap插件

2015-12-07
阅读 4 分钟
16.8k
前言 放弃jQuery,拥抱MVVM,拥抱组件吧! vue-touch基于hammer,对于普通简单手势的页面来说过于庞大! 于是想自己实现一个最常用的手势tap。顺着自定义指令和插件文档,昨晚实现了一个v-tap指令,丢出这篇干货。 指令与插件介绍 自定义指令和插件官方文档中也介绍比较简单详细,就不过多介绍。 我先说下本插件就用了三...

可想实现一个自己的简单jQuery库?(十二,完结篇)

2015-11-24
阅读 2 分钟
3k
Lesson-11 新增width,height,extend 事件部分讲完了后,我们最后实现3个方法. {代码...} 关于width(),height()就常用的就2种,一个是取值,一个是赋值. 我们通过判断arguments的个数,是取值还是赋值. 赋值很容易,我们就用最简单的办法,直接设置. 如果是取值,那我们就要做个判断,因为window,和document的取法是不一样的. 还...

可想实现一个自己的简单jQuery库?(十一,实现事件委托)

2015-11-24
阅读 4 分钟
3.3k
Lesson-10 实现on,off的事件委托! 我们能根据之前的思路,利用同样的方法实现一个事件委托. 先来看看流程图 然后先看看结果是如何,毕竟流程图看的也不一定能懂。 最后我们再来看看代码 {代码...} 继续再看一遍log的结果,对比刚刚的代码 连同代码,我在注释里已经非常的详细解释了整个过程,大家结合控制台log的结果,在...

可想实现一个自己的简单jQuery库?(九)

2015-11-22
阅读 2 分钟
3.3k
Lesson-8 事件机制 在讲事件机制之前呢,我们有一个很重要的东西要先讲,那就是如何实现事件委托(代理). 只有必须先明白了如何实现一个事件委托,我们才能更好的去实现on和off.在我看来,on和off里最难实现的就是他的事件委托. {代码...} 以上是我对整个委托的实现,当然在这只做了非常简单的实现,没有对很多别的情况进行判断...

可想实现一个自己的简单jQuery库?(八)

2015-11-21
阅读 2 分钟
3k
Lesson-7 新增 html,append,before,after,remove {代码...} html()方法我就用了这种很愚蠢的方法实现了!比起之前的data,attr,css什么的简单多了,大家可以自己继续完善. 接着是我们的重头戏,3个文档插入.我找到了一个原生js叼叼的方法 insertAdjacentHTML 来让我们去看下MDN是怎么解释的 概述 insertAdjacentHTML() 将指...

可想实现一个自己的简单jQuery库?(七)

2015-11-20
阅读 3 分钟
3k
Lesson-6 这个版本完善hasClass和css 方法. 新增 attr和data {代码...} 在我们上一个版本中,没有对css方法传对象进行解析,在这我们要进行完善. 刚刚好我们现在已经有了each方法!直接用上吧! 在我们的for循环中,要先判断下传入的attr参数是字符串还是对象. 如果是字符串,我们就按照css('width','100px')这样的方式处理 如...

可想实现一个自己的简单jQuery库?(六)

2015-11-19
阅读 4 分钟
3.3k
Lesson-5 这个版本新增6个方法,find(),first(),last(),eq(),get(),ajax 先给出代码 {代码...} 我们要仔细分辨下,这4个方法在jQuery中返回的都是什么对象?到底是dom对象还是jQuery对象. 明白了这个后就很容易能写出这4个方法 {代码...} 首先find, 我们知道一般都会这样写 $('div').find('span') 查找div下的span,返回的是...

可想实现一个自己的简单jQuery库?(五)

2015-11-18
阅读 2 分钟
2.7k
Lesson-4 这个版本我们要增加一个用的非常多的方法! 那就是each! 我们知道each不仅能遍历数组,还能遍历对象. 首先我们需要一个对数组进行验证的方法 {代码...} 接着就是我们的重头戏 {代码...} 因为我们还可能遍历Kodo数组对象 如 {代码...} 所以还需要一个判断 是否是Kodo数组对象 {代码...} 在这应该强调下call的用法,...

可想实现一个自己的简单jQuery库?(四)

2015-11-17
阅读 1 分钟
2.7k
Lesson-3 修改f(selector) 里的判断,新增domReady 我们知道在jQuery中还有一种选择器写法 {代码...} 在dom加载完毕后马上就执行,这样的方法会比onload更快,所以domReady对于我们来说一定是必不可少的 我们在init方法中要新增以下判断 {代码...} 首先selector可能为object的情况,比如传入的是原生dom对象,dom数组对象. 另...

可想实现一个自己的简单jQuery库?(三)

2015-11-16
阅读 2 分钟
3.7k
Lesson-2 这个版本新增 next(),prev(),parent(),parents() 这4个选择元素的方法还是比较常用的 首先我们需要一个func来过滤我们需要的dom {代码...} 上面那段比较简单,就是普通的过滤下元素 {代码...} 看下next方法的源码就知道,我传入Kodo数组对象的0个dom对象,然后取它的下一个同辈元素,直接返回,prev方法同理 {代码.....