112020.2

git 撤销上一个 commit

在一些时候,我们不小心提交了一个 commit,在 push 之前,我们希望将这个 commit 撤销,重新提交。这个时候,你可以使用下面这条命令:

git reset --soft HEAD^

--soft 和 --mixed 都可以使用。这样就可以撤销上一条 commit,而且我们还可以利用类似都命令撤销前几条,例如:

git reset --soft HEAD~2

表示撤销 2 条。~ 后面都数字就是撤销的 commit 数。

19:51:44 已有0条回复

linux 下以二进制的方式安装 nodejs

在一些linux环境下,安装最新的nodejs比较麻烦,因为受到linux源的影响,往往直接通过yum/apt安装的都不是想要的版本,因此,必须自己去选择对应的版本来安装。但是,nodejs官方又不会为所有的操作系统打包,而编译安装常常又会遇到依赖问题。所以在一些情况下,我们需要在linux机器上,直接下载官方构建好的产出结果来运行。

例如,我们现在需要安装v10.x版本,我们通过wget下载对应的-linux-x64.tar.gz文件,然后通过tar命令将其解压到/usr/local目录下,/usr/local 目录是用于存放各种软件程序的地方。然后将文件夹重命名为 /usr/local/node10 这样的文件夹名字。

tar zxvf node-v10.9.0-linux-x64.tar.gz // 解压文件夹
sudo mv node-v10.9.0-linux-x64 /usr/local/node10 // 移动+重命名

接下来,我们要将 node 的可执行文件目录加入到环境变量中:

## /etc/profile
export PATH=$PATH:/usr/local/node10/bin

接下来,是将路径加入到 sudo 中:

## /etc/sudoers
secure_path = ...:/usr/local/node10/bin

这样处理之后,就可以使用 sudo npm i -g 等命令了。

如果你的 sudo 需要代理,还需要:

## /etc/sudoers
Defaults env_keep += "http_proxy https_proxy no_proxy"

这样 sudo npm i 才能通过代理进行安装。

完成上面步骤之后,重启服务器(重启是为了让配置对所有用户生效,也可以不用重启,在 bashrc 中增加环境变量,并通过 source 命令使之生效)。

15:34:42 , 已有0条回复
042020.2

因为疫情,只能窝在家里,体验了小姨子的 MacBook Air 11,特别小,屏幕边框还是特别宽那种,虽然小是小了些,但是真的特别小巧,而且特别轻,这才是我理想中可以随身携带的手提电脑,和一本书的大小差不多,重量上还不及一些厚书。放在书包里可以方便办公。当初我买了一台 18 年 MacBook Pro 13 寸,现在想来,其实不值,如果追求性能,应该选 15 寸,如果追求轻薄,应该选 11 寸 air。

19:00:31 已有0条回复
062020.1

在切换至 ubuntu 之后,本来有意打算使用 firefox 作为默认浏览器,毕竟是开源的亲儿子,甚至有想把 firefox 作为常用浏览器的打算。但是在挣扎一段时间之后,还是放弃了。原因有两个:1. 慢,和 chrome v8 比,确实慢。2. 标准支持,和 chrome 相比,还有一些标准不支持,导致我的程序无法运行,而且因为是正则,还没有办法 polyfill。另外,从开发者工具的使用体验上,chrome 的开发者工具显然要优秀一些。所以,最后,只能抛弃 firefox,再投入 chrome。

12:38:37 已有1条回复
  1. 我也想拿 Firefox 来当平常的浏览器使用,但是真的不争气啊。
    标准,速度方面倒还不说,我最在意的是进程内存占用不释放,使用时间长了内存越升越高,就算你把标签页差不多都关了,尤其是主进程内存一直不下去。
    第二点就是同样的情况下,CPU占用就是比Chrome高。
    其它的都不说,毕竟都是一会儿的事,但是内存一直不释放是持续的问题,我经常是浏览器一打开几天都不关,这种情况下无法忍受。
    真的是不争气,一直升级一直这样。
    #960 Pader 2020-09-09 13:08 回复
082019.12

Ubuntu18初体验

Ubuntu18已经发布一年多了,我一直忍者没升级,因为我挺喜欢原来的桌面风格的。但是因为它老是提示升级,我又有点强迫症,毕竟人要跟上时代,有些变化不得不跟着去适应,就像生活一样,所以,最后,我还是决定冒险升级一下。整个升级过程中有几次交互,我都点了 keep。最后升级完,重启,新的桌面系统,不得不适应一下。经过一会儿的调整之后,得到了我想要的界面,既然使用了 gnome 桌面,那就更像 windows 一些吧。

20:17:40 已有0条回复
032019.12

啥是微前端?

微服务应该很多人都听过了,大概是将一个大的复杂应用,拆分成多个独立的应用,通过 API 接口的方式串联在一起的,后端应用。微服务确实是后端的应用架构。而在前端,不知道是为了赶时髦还是什么意思,类似的概念被称为“微前端”,就是将原本一个完整的应用,通过某种架构形式,拆分为多个独立的应用,在整体层面,又可以将这些独立应用融合在一起,完成应用本身的功能。

形象的举个例子,假如说,你有一个订餐应用,现在要增加一个给外卖小哥用的独立部分,以往的做法,是在原有的基础上,新开一个菜单作为入口,进来之后是独立的模块,为了独立,尽可能和其他模块不产生耦合。在微前端的概念下,这个新的部分,则是一个完整的独立应用,它有一个入口,但是肯定不是在底部的菜单栏中,而可能是在首页的某个按钮区域内,点击进来以后,就像进入一片新天地,所有功能和外部没有任何耦合的地方,全部是自己独立的。没错,你会想到小程序,特别是支付宝首页菜单点进去的小程序。微前端就是这种架构,只不过是针对的web。

在我的直观感受中,微前端就是一个更高层面的路由和应用加载系统。路由就是要确保在已有应用基础上,两个应用可以不打架。当然你可以要求所有微前端应用的团队按照你的这个主体框架的要求来配置路由,但是对于需要复用的微前端应用而言,它不一定只在你一个框架中运行,可能在多个框架中跑,这个时候,没法只遵循你的路由规则。因此,微前端上层框架,首先要解决路由问题。其次要解决的是应用加载问题,一般而言,微前端里面的每一个微前端应用,都是异步加载的,就和小程序一样,当需要使用这个小程序的时候,才会下载下来运行。这和我们现在流行的 webpack 打包的方式完全不同,微前端框架如何去加载和渲染异步的应用,而且还要保证和路由一起工作良好。最后,除了这两大问题之外,还要解决样式冲突、状态共享、路由跳转传参等等问题。这些林林总总的问题凑到一起,OMG,又是一个新趋势……

但不管怎样,随着前端发展趋势,感觉这确实是要面临的一个问题。

12:29:00 已有0条回复
262019.11

使用 @babel/plugin-transform-runtime 的时候遇到坑。这个插件要求我们必须安装 @babel/runtime 系列,根据它的 corejs 参数,我们需要安装 @babel/runtime-corejs3 这种包,但是经过摸索之后我发现这里的 corejs 版本填写的越高,被植入的 polyfill 越多,到最后,打包出来的代码比之前大了很多。原本以为 corejs 版本越高越好。但是现在顿悟了,为了代码体积,放弃 corejs3 直接使用 @babel/runtime。之所以高版本 polyfill 加载的更多,我想是因为标准有一点改动,都会有新的 polyfill 被加入到 corejs 中,这就导致代码越来越多,最终导致原本为了减少代码量而使用的 transform-runtime 现在变成了负担。

17:29:49 已有0条回复
242019.11

占位符历险记

我是占位符,英文名placeholder,在编程领域跑龙套,开发者经常用到我,但我从来不是主角,我一直揣着一本《符号的自我修养》,并梦想有一天可以成为一个故事的主角而给开发者和用户带来快乐。我把我的故事写下来,希望在我的故事里,你可以获得一些乐趣吧。

配置

有一次,我到了一场叫“配置”的剧场里,导演在找一个跑龙套的,因为在这场剧里面,开发者不能直接把密钥写在代码里面,但是在运行时的时候,又要求使用这个密钥,密钥只会呆在独立的服务器里面。导演拿它没有办法,这个时候我毛遂自荐,上去说到:你把我放在本来要写密钥的地方,等构建的时候,再把密钥从密钥服务器里面拉下来,让密钥过来替我。导演拍了我的脑袋,说,你小子还真行。以上构建机,跑了大概10分钟,导演就让我去领盒饭了。

xargs

我灰溜溜串场到命令行的时候,遇到了 xargs,它让我过去帮忙。

ls /xx | xargs -t -I{}  cp {} /tmp/{}

moment.js

我签约了 moment.js,经常在它的剧里面跑龙套,例如:

'YYYY-MM-DD HH:mm:ss'

插值

在我25岁的时候,终于熬出了头,在一类叫“插值”的戏里,几乎每一场戏都有我,虽然每次出场我都被化妆师重新化妆。

<div>{{ text }}</div>
<div>{{ dog }}</div>

保持替换

真正让我在演艺界找到自己价值的,是在一场叫保持替换的电影里。在这场电影里,一个字符串中的某些字符要被替换,但是具有特殊样子的字符不会被替换。我不是这些特殊样子的字符,我在它们的变化过程中扮演了极其具有技术性的一环。

DD\D 要被替换为 44D, 因为最后一个D前面有一个\,所以这个D不能被替换掉。

刚开始导演没打算用我,直接使用正则 ?<! 就能实现。后来发现,浏览器不支持,于是不得不请出我这个大神。一开始,我给出了非常简单的方案:

先把 \D 改为 ___4___,等所有的 D 都被替换为 4 之后,又把 ___4___ 替换为 D,这样就可以了。

但是,这样不行,因为用户可能在字符串里面本身就包含了 ___4___ 这个字符串。我请出来深山里面的 unicode 来帮忙:

先把 \D 替换为 '\uddd1', \d 替换为 '\uddd0' 这种形式,这样,这些字符就是用户很难输入的了,几乎不会输入这种字符。后面再把这些字符给替换回来。

这样,我完美装逼,导演给我颁了一个最佳技术奖。

未完待续。。。

我的故事还在继续,你有你的故事么,跟我分享一下呗

17:32:29 已有0条回复

iOS Safari浏览器上overflow: scroll元素无法滑动bug解决方法整理

222019.11

一篇文章发布了两年了,阅读量仍然很飙,可见好文章不会过时,大家都知道我是写前端,区块链我一窍不通啊老铁

14:26:00 已有0条回复