闻心阁

一蓑烟雨看苍生,半壶浊酒笑红尘

Vim YouCompleteMe 使用整理

2018-05-03 约 1 分钟读完 搬砖秘籍
YouCompleteMe 是我使用 Vim 的必备插件,同时也是最难装的插件,没有之一。本文记录笔者在使用这个插件的一些心得,嗯,这个会持续更新的。 安装 在 Manjaro 上安装没有遇到过什么问题,基本按照文档一路来就好。 在 macOS 上因为要用到 python,并且 macOS 系统自带的 python 并没有安装 pip,所以要麻烦一些,解决方案看这里:macOS切换Python2和Python3的探索 ultisnips 冲突 Vim 的 ultisnips 插件也使用的是 tab 触发,这里会有冲突,解决方法,在 .vimrc 中加入下面的代码: let g:ycm_key_list_select_completion = ['<Down>'] let g:ycm_key_list_previous_completion = ['<Up>'] 把 ycm 的前一项和后一项绑定到小键盘上。 巧用 .tern-project 文件 最新版本的 YCM 已经兼容了 Tern,在我们开发 JavaScript 相关项目时,可以在根目录配置这个文件来增强这个插件的能力。 示例(React): { "ecmaVersion": 6, "libs": [ "browser" ], "loadEagerly":[ "node_modules/react-dom/dist/react-dom.js", "node_modules/react/dist/react.js", "node_modules/react-dom/dist/react-dom.js", "node_modules/react-dom/dist/react-dom-server.js" ], "dontLoad": [], "plugins": { "es_modules": {}, "node": {} } } 关于这个文件的详细写法可以参考这里:tststs/atom-ternjs

使用jquery.simple-scroll-follow实现滚动跟随

2018-05-03 约 1 分钟读完 搬砖秘籍
在开发麻辣GIS的时候需要实现一个滚动跟随的效果,写得自己脱了一层皮,各种计算,不过好歹实现了。最近把个人博客也想加上这个效果,不想再重复造一次轮子。于是发现了这个:sutara79/jquery.simple-scroll-follow 尝试使用了一个发现还不错,比自己重新写一次要好得多。不过有些效果还是自己手动调教。 Demo 本站右侧的广告就是了,但触底的效果还是有点问题,等我搞定了再来总结一下。

macOS切换Python2和Python3的探索

2018-05-03 约 1 分钟读完 搬砖秘籍
最近要在 macOS 下安装 YouCompleteMe ,需要一个 Python 环境。考虑到 Python2 即将被放弃,安装一个 Python 也是必要的。所以探索了一下在 macOS 下同时安装这两个版本的方法,本文做一个小总结。 前言 一般情况下,macOS 是自带了一个 Python 环境的,一般是2.7,但编译 youcompleteMe 的时候发现需要pip。本来想基于自带的安装 pip,后来百度了一下发现使用 Homebrew 安装的 Python 都是已经安装好 pip 了。所以本文的方案不动自带的 python,使用 Homebrew 重新安装。 安装 Python2 和 Python3 直接运行 brew search python 结果如下: 其中 python 是 3.x 版本, python@2 是 2.x 版本。 运行 brew install python brew install python@2 此时运行 brew info python brew info python@2 可以查看这两个版本具体的安装信息。 图中两个箭头分别是 Homebrew 安装的python目录和映射到的目录。 替换系统默认 Python 这时运行 python 命令你会发现使用的还是系统默认的 python. 继续阅读

macOS下Vim“正确”的使用方式指南

2018-05-03 约 1 分钟读完 搬砖秘籍
在 Manjaro 下使用 Vim 习惯了,到 MacOS 下也想配置下 Vim,结果发现了几个坑。经过一段时间的摸索,自认为找到了一种不错的解决方案,这里做一个总结。 安装 Homebrew PS:必须。 安装方法很简单,直接参照官网来就可以了。The missing package manager for macOS — The missing package manager for macOS 安装 iTerm2 PS: 不必须但建议。 MacOS 自带的 Terminal 我觉得不好用,就换成了这个。 安装 oh-my-zsh PS:不必须 安装方法直接参照官网来:robbyrussell/oh-my-zsh 不要忘了更改默认的shell chsh -s /bin/zsh 安装 MacVim 为什么?因为系统自带的 Vim 不支持剪贴板(这个不能忍),而我又不想自己编译 Vim,使用 MacVim 是最简单、最方便的解决方案。 这里要注意的是,安装 MacVim 不要通过官网下载二进制包了,要使用 Homebrew 来安装。 brew install macvim 安装完成,可以在命令行中输入 mvim 弹出 MacVim 表明安装成功。 替换系统默认 Vim 在 .zshrc 中加入 alias vim='mvim -v' 这样在命令行中输入 vim 命令调用的就是 MacVim 了。 继续阅读

浅说JavaScript之Event Loop(上)

2018-03-14 约 1 分钟读完 搬砖秘籍
Event Loop 也叫事件循环,是 JavaScript 中的基础概念,听起来蛮唬人,查了一些资料,斗胆用大白话来说说这个东西。PS:仅限浏览器的讨论。 为什么会有 Event Loop 这一切还要从 JavaScript 的诞生说起,因为造它的用途简单,就是来浏览器“谈谈心”。谈心嘛,套路什么的不用太深,给你一个单线程的脑子就够了。于是乎,这“一根筋”的 JavaScript 就来到了人间,虽然这个呆头呆脑的家伙后来上了一件叫 “Worker” 的装备,也开始学会了城里人的套路,但它总归是村里出来的(web worker本身限制诸多,有空再叨),再多的套路也没变了它“一根筋”的本质。 虽然它“一根筋”,但它不傻。不管工作多么忙碌,人家照样张弛有度。举例来说,就像衣服放洗衣机了,它才不会在那等着45分钟衣服洗完去晒,而是继续扫地、打麻将…等听到洗衣机洗完响了,再去收。它的这个本事就叫“非阻塞”,而让它能有这个本事的,就是今天的主角——Event Loop。 Event Loop 的流程 说起 Event Loop 的流程,要先看这张来自 Philip Roberts 的图。 基本的过程就先从左边看起,JavaScript 主线程运行的过程中产生了 堆(heap) 和 栈(stack),栈中的代码顺序执行,当遇到“拦路虎(异步)”操作的时候,就把这“锅”扔给浏览器老大哥,并对它说“大哥,这事我不好搞,你帮搞定吧。对了,搞定完了,和我弟(任务队列/task queue)说一声啊。”。然后继续栈中的代码跳过这,继续往下走,再遇到(比如DOM操作,AJAX请求)再找老大哥。。。 当栈中的活都干完了,“哎?大哥帮我把事处理的怎样了?找我弟问问去。” 老弟(任务队列)给了一个列表:二哥,这些活(回调),还要你干。 于是,把任务队列的活再接着干,直到没活可干,就可以休息了。 这就是上面图的流程,所以同步总要比异步的结果先出来。比如: setTimeout(function(){ console.log('2') }, 0) console.log('1') console.log('3') 结果: 1 3 2 老弟的账本(任务队列的秘密) 既然 JavaScript 这么信任小弟,那小弟做事也不能马虎,对浏览器老大哥也是言听计从。可老弟也是一个有原则的人。当浏览器老大哥给来一堆任务的时候,哪个在前,哪个在后呢? 老弟内心也门清,他把这些任务分为了2类,当官的(micro task)和老百姓(macro task)。任务来了,他就先看看身份,然后把他们放到不同的队伍中去(干部的纯洁性嘛)。于是当大任务(好处)来临时,干部优先嘛,先处理micro task,再处理macro task。 那何人可为官? new Promise() new MutaionObserver() 老百姓是谁? setInterval() setTimeout() 所以下面的代码: setTimeout(function () { console.log(1); }); new Promise(function(resolve,reject){ console. 继续阅读

text-overflow: ellipsis 无效的解决方案

2018-03-12 约 1 分钟读完 搬砖秘籍
一个简单的需求,要展示用户的微信名,有的人喜欢把微信名起的很长,导致一个框框显示不下,于是用到了 text-overflow 的属性。代码如下: width: 90%; margin: 0 auto; overflow: hidden; font-size: 14px; color: #fff; text-align: center; text-overflow: ellipsis; 可效果不是我想要的 解决方案 可以看出问题出在换行,加一句white-space: nowrap;即可。

NodeJS 将 JSON 转换成 EXCEL(CSV)

2018-03-09 约 1 分钟读完 搬砖秘籍
最近要使用LeanCloud的数据,导出来是一个JSON格式的文件,妹子根本没办法打开处理,于是使用 Node 将这个JSON文件转换成CSV格式的文件,让她能在EXCEL中打开使用。 方法 用到了2个库,一个是 zemirco/json2csv,另外一个就是系统自带的 fs 模块了。json2csv 这个库非常强大,可以在命令行及Javascript module方式使用,具体使用参考github地址即可。 代码 var fs = require('fs'); const Json2csvParser = require('json2csv').Parser; const fields = ['car', 'price', 'color']; const myCars = [ { "car": "Audi", "price": 40000, "color": "blue" }, { "car": "BMW", "price": 35000, "color": "black" }, { "car": "Porsche", "price": 60000, "color": "green" } ]; const json2csvParser = new Json2csvParser({ fields }); const csv = json2csvParser.parse(myCars); console.log(csv); fs.writeFile("./out.csv", csv, function(err) { if(err) { return console. 继续阅读