- 博客(89)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 Graphql采坑之-全家桶版本兼容性
引言在配置日常的react 项目中发现要搭配好react，apollo-client，graphql的版本还是不容易的，尤其是在众多package单独拆解功能的情况下。经过几天的摸索勉强找到了npm package的版本清单。package.jsondependencies": { "apollo-cache-inmemory": "^1.6.0", "apollo-cl...
2019-05-30 17:21:31
698
原创 vue-loader兼容性采坑：No parser and no filepath given, using 'babylon'...
现象在webpack dev开发环境，部署了vue-loader@14.2.2版本，编译后在命令行报一系列的No parser and no filepath given, using ‘babylon’…信息，让人一开始无法定位问题出在哪里？解决方案更新到14.2.4，虽然当前最新的是15.6.5版本，不过从v14迁移到v15会有不少变更，配置不好也会报错，具体参见https://vue...
2019-02-11 19:27:00
3366
翻译 npm中package-lock.json存在的价值
介绍如果把npm更新到了5以上，默认就会有package-lock.json。很多时候我们直接把它ignore或直接从项目中删除，然后直接从npm install来安装依赖。那么坑就此埋下了，尤其是在多人协作的时候，很有可能出现的情况是依赖报错了。那么这个文件存在的目的是什么呢？总结先给出结论：package-lock.json是^5.x.x自带生成的你应该使用package-lo...
2019-02-11 11:35:46
1248
原创 git push前强制检查冲突
引言有时候同事间会因为疏忽而没有完全处理冲突，而git本身是支持未解决冲突的代码push的，因此就给包括测试、生产的多个部署环境带来可能的运行runtime bug隐患。借助git本身的hook钩子函数，想要强制push前检查冲突是否完整还是非常简单的。解决方案1. 定位git hook钩子文件git的所有配置文件一般统一存放在.git目录下，而钩子文件就放在该文件下：如上图显示是在v...
2018-10-23 19:41:48
4567
1
翻译 redux 多种触发dispatch方式
[原文链接]https://blog.bam.tech/developper-news/4-ways-to-dispatch-actions-with-reduxredux 作为js app的主要的状态容器和react结合的非常多。架构设计上基于action的触发机制，通过dispatch对应的action来修改状态，而状态的修改由统一的reducer来处理（为什么叫reducer呢，因为每个...
2018-09-13 10:32:34
35338
原创 【前端踩过的坑】react-navigation 与redux的配合
在初期使用redux的过程中，想要搭配react-navigation使用（以下简称RN，不是react-native），RN负责路由，而redux负责state的统一管理。基本的思路是： PS:为了关注核心删去了不必要的部分const ListStack = createStackNavigator( { Home: ListScreen Add: AddScr...
2018-09-11 16:01:15
1024
翻译 Redux 核心代码解读
引言好奇于redux的核心代码是多么的短小精悍，顺便了解下其实现机制，所以找到其源码，而其中最核心的相比就是createStore这一个文件，看看大神是怎么做的吧。代码资源：https://github.com/reduxjs/redux/blob/master/src/createStore.js翻译中import $$observable from 'symbol-obse...
2018-09-07 17:41:35
289
翻译 【前端面试系列】JS中的闭包-来龙去脉
引言经历过面试的前端人被问得做多的一个话题或许就是js的闭包了吧，就好像高考中总要出些难题来拉开不同人的差距，而闭包就是如此，哪怕平时用的不多，但是因为其特殊性总被拿来衡量一个前端人的js掌握情况。 以前也陆陆续续看过不少资料，书籍，对其的解释五码八门，大差不差，但从来无法回答自己几个核心问题（例如为啥叫closure，到底使用场景是什么），所以一直无法深入去理解，也就更别提灵活的使用了。 ...
2018-09-02 22:36:24
1152
翻译 【前端面试系列】CSS Animations
引言前端面试总躲不过的几个知识点，像js的prototype，css的动画，当然高级点的性能优化不在本教程的内容列表里面，属于提高的内容。而本节就着重讲css的动画讲清楚。 资源来自：https://www.w3schools.com/css/css3_animations.asp 注意：以下所有内容翻译自上述官方教材，可能需要翻墙查看，强烈推荐点击链接中的示例代码，对比分析加深印象...
2018-09-02 16:25:24
1074
原创 【前端踩过的坑】js Date的时间戳timestamp和unix时间戳有区别么？
js 获取的时间戳的方式是（new Date()).getTime,得到的例如1534982400000,然后默认就以为是moment里面的unix，然后使用moment.unx(1534982400000)来转换，后面发现居然不对。Date.getTime 在MDN中给出的官方说法是： The getTime() method returns the numeric value co...
2018-08-30 14:41:24
2925
原创 React input 中文输入法兼容
在不少项目中需要针对input的输入数据做相应的处理，比如讲用户数据的数据转换成对应的大写字母，那么问题就来了。当用户拿起手机，点中你的input组件后开始输入时，会发现IOS的手机在中文输入下会发生重复输入的情况。举例来说，当用户在中文输入法下输入ABC这几个字母是，input的实际的value值（如果你把input的onChange事件打印出来或是设置成value的话），不是ABC而是AA...
2018-08-27 23:43:03
4738
翻译 react-native 页面导航navigation
屏幕页面间的导航跳转移动app很少是由单一的页面组成的。管理多个页面间的呈现和过渡是navigator导航器所必须要处理的一个任务。这篇文章覆盖了在React Native中的大部分导航组件。如果你对导航也是一知半解，或者说刚入门，你可以尝试使用React Navigation这个npm包。该包提供了一种简单易用的导航方式，可以同时满足对stack navigation和tabbed na...
2018-08-26 17:24:50
1275
原创 Fetch API 简介
The Fetch API provides an interface for fetching resources (including across the network). It will seem familiar to anyone who has used XMLHttpRequest, but the new API provides a more powerful and fle...
2018-08-19 17:21:33
609
原创 MacOS 安装 Android Debug Bridge (ADB)
安装方式-homebrew$brew cask install android-platform-tools$adb devices
2018-08-18 09:31:29
890
原创 on-my-zsh 安装node
node的默认安装方式通过nvm安装zsh-nvm插件zsh-nvm是基于zsh的nvm插件，安装完后直接可以使用nvm命令 【官方链接】(https://github.com/lukechilds/zsh-nvm)配置也非常简单，这里采取As an Oh My ZSH! custom plugin方案，感觉比较通用：克隆代码到本地目录 git clone http...
2018-08-01 11:29:20
1112
转载 Yarn 如果优化npm版本控制
今年10月，Facebook发布了Yarn一个新的JavaScript包管理CLI客户端工具，意图与NPM相竞争。起初，包括我自己在内很多人对此均持怀疑态度，这确实也很合理。同一生态下的多依赖管理解决方案，事情很容易就会变得复杂。那在这种让人复杂地让人感到痛苦的情况下，任何增加复杂性（的行为）都是极其糟糕的。Yarn发布初始版本之后，我体验了Yarn大约15分钟，得出的结论是：Yarn是为...
2018-07-31 16:39:58
838
翻译 react shallow Compare
Note: shallowCompare已经被抛弃.请使用React.PureComponent来代替.在React.PureComponent 被引入之前，shallowCompare被广泛使用，用来实现和PureRenderMixin相同的功能。 如果你的React组件的render方法也是pure（纯，给定props和state，render结果相同）的, 你可以使用这一...
2018-07-30 17:14:11
959
原创 react 数据懒加载-滚动实现
使用场景项目中碰到这样一种情况，后台接口数据由于太多没法一次传输，因此希望前端在调接口时设置pageIdx和pageSize字段实现懒加载。前端页面上边一部分为选项栏下面一部分为滚动区域，大致的html结构简单抽象如下：<div className='wrapper'> <div className='header'></div> &lt
2018-07-28 11:01:50
13614
翻译 mysqldump 官方文档翻译
翻译自简介mysqldump 客户端client 最初是由Igor Romanenko写的备份程序。可以用来备份一个数据库或是用于备份数据库中的collection，备份后可以产送给不同的数据库服务器（不仅仅是MariaDB或是MySQL）。dump操作包含SQL语句来创建和populate table。然而mysqldump同样支持生成CSV文件和类似XML格式的其他分割后的(delim...
2018-07-25 16:47:27
553
转载 PHP命名空间 namespace 及导入 use 的用法
转载自 在PHP中，出现同名函数或是同名类是不被允许的。为防止编程人员在项目中定义的类名或函数名出现重复冲突，在PHP5.3中引入了命名空间这一概念。1.命名空间，即将代码划分成不同空间，不同空间的类名相互独立，互不冲突。一个php文件中可以存在多个命名空间，第一个命名空间前不能有任何代码。内容空间声明后的代码便属于这个命名空间，例如：<?php echo 111; ...
2018-07-25 14:43:39
1289
原创 es6 promise setInterval setTimeout混合使用
Question最近在使用promise过程中突然想到如果在promise的resolve，reject中调用setInterval，会不会持续的触发resolve操作？Answer尝试编写下面的代码：function a() { return new Promise((resolve, reject) =&gt; { setInterval(()=&g...
2018-07-25 13:35:19
6566
原创 记一次智力问答
问题刚来到新公司，一天晚上加班跟新同事聊着聊着面试的话题，突然不知怎么的同事抛出一个问题来打赌，赌下个月的饭前。 一时上了头就来劲了，结果自以为是的以为能够轻松搞定，没想到被将了一军。问题是这样的： 经典的智力问答：一个人要走50步路，每次只能走1步，或是2步,求总共有多少种走法？解答当然了，要求是得给出解析解。自个兴冲冲的以为类似高中的常见题型，发现上当了。按照高中所学顶多给
2018-01-22 00:54:32
218
转载 nodejs stream 经典解析
转载自：https://github.com/jabez128/stream-handbook/blob/master/README.mdstream-handbookstream-handbook的完整中文版本nodejs stream 手册 写在前面的话: 如果你正在学习Nodejs，那么流一定是一个你需要掌握的概念。如果你想成为一个Node高手，那么流一定是武功秘籍中不可缺少的一个部
2017-12-31 23:51:48
766
原创 [debug]jsonp 403 forbidden 通用解决方案
问题描述前端的跨域问题由来已久，暂时的主流方法是CORS和JSONP，在jsonp的使用过程中经常发现各种问题，例如get error aborted，403 forbidden等等。 而且就代码美观来说，硬生生把回调函数callback封装在url中，然后再将url硬生生塞进script中直觉上也不合理。所以有时候不得不采用服务器代理，但是这又增加了不少工作量，如果是大公司进行统一的管理调度还行
2017-12-30 10:57:43
2227
1
原创 python 打包发布pypi package
introduction有时候自己开发了一个python的package想要和他人分享，一个不 错的方案就是发布到pypi官网，这样大家都可以通过pip来安装。下面简单介绍下操作流程。step 1:注册账号登录pypi首页完成注册： https://pypi.python.org/pypi 注册中需要邮箱，在完成页面注册后记得在邮箱中查看确认邮件完成邮箱认证step 2:构建目录结构这里默认
2017-12-25 11:08:26
1182
原创 那些年，React 踩过的坑
1. propTypes 空数组报undefined Warning举例来说：import React from 'react';import { Breadcrumb, Icon } from 'antd';import PropTypes from 'prop-types'const BreadcrumbBlock = ({ paths }) => { const items = path
2017-12-22 16:52:53
349
原创 docker加载volume并绑定端口
要求已获取docker image，现在想要创建container，加载本地目录到container目录，还有映射本地和container之间的端口。 具体举例如下：image ID: 884e0fc83dfe设置container name: test将本地的9000端口映射到container的80端口加载数据卷volume：将本地的~/Desktop/test 映射到containe
2017-12-19 21:33:01
916
转载 Git团队协作使用规范
转载自：http://blog.csdn.net/self001/article/details/7333096Git 使用规范特别提醒：使用Git过程中，必须通过创建分支进行开发，坚决禁止在主干分支上直接开发。review的同事有责任检查其他同事是否遵循分支规范。在Git中，默认是不会提交空目录的，如果想提交某个空目录到版本库中，需要在该目录下新建一个 .gitignore 的空白文件，就可以
2017-12-16 12:56:38
2670
原创 [软件推荐]mac下加载NTFS格式U盘或硬盘?
问题描述在实际生活中，使用到微软NTFS格式的存储设备还是很多的，由于开发使用mac，所以特别需要能够自动加载NTFS格式的软件来自动读写里面的内容。而一般情况下，mac可以自动加载NTFS格式存储介质，但是是只读的，实际环境中大部分是需要能够读写的，因此常识过多种方案。ntfs-3g:搭配TUXERA使用，下载比较慢，虽然本身不大。作为一个命令行工具增加了使用难度，一两次还好，次数频繁显得麻烦
2017-12-12 00:30:10
1637
原创 Tips: JQuery 多元素选择并转化成数组
应用场景html的form中包含多个checkbox组件，希望能够在用户选择后以数组的形式返回用户的选择结果（指的是value中的值）: 得到的结果示例为：['SO2', 'NOX', 'CO', 'PM']JQuery解决流程正常的JQuery思路为：var variables = $('input[name=variables]:checked').map(function(){
2017-12-02 18:24:33
2377
原创 Debug: django model querysets-> pandas.Dataframe
问题描述在使用Django 的ORM model时，有时需要将数据导出并转变成pandas DataFrame。正常的流程应该是：import pandas as pdfrom model import testeModeldata = testModel.objects.values()# .values()返回的是［object1,object2］df = pd.DataFrame(dat
2017-12-01 22:42:42
3028
转载 karma 测试框架的前世今生
引言在前端测试框架的学习中了解到了karma的强大，搜索得到淘宝前端团队的这片讲述karma特点及原理的分享，非常不错。转载分享至此， 原文链接：http://taobaofed.org/blog/2016/01/08/karma-origin/ 原作者： 亦才［2016-01-08］正文背景JavaScript 作为 web 端使用最广泛的编程语言，它是动态语言，缺乏静态类型检查，所以在代码编
2017-11-25 09:59:17
2076
1
原创 Debug: babel arrow function 'unexpected token' in React.Component
问题描述// index.jsimport React from 'react';import ReactDOM from 'react-dom';class App extends React.Component {....onHandler = () =>{ //报错 ....}...} SyntaxError: src/index.js: Unexpected to
2017-11-24 18:40:17
697
转载 Presentational and Container Components
引言在学习React和Redux的过程中经常提到Redux作者Dan Abramov的一篇非常好的文章，讲述组件基于功能的分类，展示组件和容器组件。国内无法访问，因此基于原文重新用markdown编辑，作为日后反复研读之用。原文链接正文There’s a simple pattern I find immensely useful when writing React applications.
2017-11-24 15:06:37
369
原创 Drupal 8 常用模块介绍
模块名称 说明 pathauto url优化：https://www.drupal.org/project/pathauto Search API 搜索增强：https://www.drupal.org/project/search_api Module filter 帮助按类整理模块
2017-09-10 17:30:22
2314
原创 matplotlib basemap 绘制多边形区域曲线
1.简介 在平常的python使用中，有些时候需要基于gis的地理数据绘制相关的数据图形，如上图所示，python中的matplotlib绘图包当然能够胜任这个工作，但实际操作中国确实有很多细节需要注意。2.运行环境python 3.5 :笔者使用python3.x，当然2.7也是一样可以的matplotlib 1.5.3Basemap 1.1.0:basemap的安装包比较大，快捷安装可以
2017-08-31 22:09:39
14500
5
原创 [matplotlib]Basemap 安装使用简介
1.basemap地图包简洁在python的众多扩展包packages中，[matplotlib](https://matplotlib.org/index.html)是用的最普遍的绘图包，而为了能够扩展其在地图绘制领域的功能（尤其在气象，地理等学科中有广泛的需求）Basemap模块就刚好能满足这一要求。2.安装方法Basemap模块相比于普通的几兆大小的安装包来说是很大的了，打包压缩后的包也要1
2017-08-30 22:15:33
23147
1
原创 ［推荐］docker中文学习文档
docker容器技术作为时下最热门的操作系统层级虚拟化技术在世界范围内应用广泛。 为了更好更快的掌握相关的技术及命令，笔者搜索了相关的电子书籍，官网等教材内容，最后向大家推荐一个不错的学习网站。 https://yeasy.gitbooks.io/docker_practice/content/ 相较于电子书籍，它更加简洁；相较于官网的英文文档，它能让你更快上手。
2017-08-25 12:15:32
360
转载 PHP Composer :安装流程
原文链接IntroductionPHP Composer is a package management system for PHP which prevents users from having to “reinvent the wheel” when it comes to commonly-used website components like user authentication o
2017-08-18 13:42:37
384
原创 Debug:Drupal\Core\Session\AccountInterface' not found
问题描述在安装完drupal 8 后远程登录上去测试drush命令报以上错误。 问题产生的原因是因为drush版本的问题，drush 6及以下版本与最新的drupal 8 可能不兼容，需要通过composer这一php包管理器安装。安装流程. First install Composer globally$ curl -sS https://getcomposer.org/installer |
2017-08-18 13:37:02
465
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人