shaobeichen / blog Goto Github PK

View Code? Open in Web Editor NEW

148.0 3.0 18.0 34.09 MB

📜 Vue3.2+Vite+TypeScript+Pinia+Setup写法，包括命令式组件写法，Eslint Prettier规范，TypeScript入门写法

Home Page: https://shaobeichen.github.io/blog/

License: Apache License 2.0

HTML 0.98% Vue 40.24% TypeScript 20.15% JavaScript 9.03% SCSS 29.17% Shell 0.43%

vue github-api github-pages vue3 vite typescript pinia setup vuejs

blog's Introduction

BLOG

介绍

个人主页，Vue3.2 + Vite + TypeScript + Pinia + Setup 写法

特性

有专门用来练习 Vue3.2 的 TodoList 案例
可以快速入门 Vue3.2 + Vite2 + TypeScript
有 Vue3 + Setup 组件写法
有 Vue3.2 命令式组件写法，组件同时支持 Vue2.x Options API 调用
有 jest + TypeScript 入门写法，写出第一个 Vue 组件测试用例，查看覆盖率
支持 eslint、prettier、stylelint、commitlint、husky 等规范
支持 GitHub Actions 自动部署项目

用法

1.安装 yarn

npm i -g yarn

2.安装依赖

yarn

3.运行项目

yarn dev

产出文章

做项目后产出了几篇文章，用于记录，帮助大家踩坑。

参考链接

jest

blog's People

Stargazers

Watchers

Forkers

w940853815 loveysgg kakudesu washedking i0xi runme opencollective silvrwolfboy hhy5277 ayidaweiwei 111111efe dragon8github cxlcode jaspergg imxuheng haowubai123

blog's Issues

大佬你这个博客可以用在Java springboot项目上吗

问题类型 / question type

项目版本信息 / Project version information

问题重现 / Problem recurrence

功能请求 / Feature request

一个诸葛亮VS十几个臭皮匠 - 反骗聊天记录

故事背景：我们有个群的群主中午时候遇到个骗子，我们集结大家的智慧，来斗一斗这个骗子，展示一下反坑技术...٩(๑>◡<๑)۶

2018-08-24 12:08:09 臭皮匠-大兵

2018-08-24 12:08:33 臭皮匠-大兵

遇到个骗子

2018-08-24 12:09:11 臭皮匠-大兵

2018-08-24 12:09:27 臭皮匠-星辰

2333

2018-08-24 12:09:47 臭皮匠-星辰

看看反过来把骗子带坑里

2018-08-24 12:18:38 臭皮匠-大兵

怎么玩

2018-08-24 12:18:42 臭皮匠-大兵

现场直播

2018-08-24 12:19:53 臭皮匠-枫

玩你妹，110

2018-08-24 12:20:43 臭皮匠-大兵

110没用的，没造成犯罪警察不管

2018-08-24 12:20:51 臭皮匠-枫

报价单呢？

2018-08-24 12:21:02 臭皮匠-大兵

我不相信警察，自己去查他ip，然后看看

2018-08-24 12:27:05 臭皮匠-翔子

兵哥吧他电脑黑了

2018-08-24 12:27:24 臭皮匠-翔子

让他无限循环播放大悲咒

2018-08-24 13:08:20 臭皮匠-大兵

2018-08-24 13:08:37 臭皮匠-大兵

@全体成员刚做了一张家转账图准备骗那个骗子

2018-08-24 13:08:50 臭皮匠-大兵

你们说我用什么借口再去骗他？

2018-08-24 13:10:01 臭皮匠-伟哥

怎么玩

2018-08-24 13:10:07 臭皮匠-伟哥

看你呀

2018-08-24 13:10:10 臭皮匠-大兵

转账图假的他那边肯定没有收款记录，然后下一步呢

2018-08-24 13:10:28 臭皮匠-大兵

走他那拿点回来啊

2018-08-24 13:11:06 臭皮匠-大兵

我擦，发现突然有东西没改

2018-08-24 13:19:45 臭皮匠-伟哥

2018-08-24 13:20:07 臭皮匠-西瓜

后事如何了

2018-08-24 13:20:48 臭皮匠-大兵

我说等员工午休结束安排人给你转

2018-08-24 13:20:56 臭皮匠-大兵

我先把图片做好

2018-08-24 13:28:01 臭皮匠-秦时

有一刹那感觉骗子好可怜

2018-08-24 13:28:02 臭皮匠-秦时

哈哈哈

2018-08-24 13:28:24 臭皮匠-伟哥

骗谁不好，骗程序员

2018-08-24 13:29:52 臭皮匠-枫

@臭皮匠-大兵你闲的无聊了啊

2018-08-24 13:32:38 臭皮匠-大兵

看下这个回执单可有问题

2018-08-24 13:34:02 臭皮匠-大兵

回单生成时间13:53，时间还早，等我吃完中饭再和他们斗

2018-08-24 13:34:40 臭皮匠-亚连

2018-08-24 13:35:08 臭皮匠-小强

可以写成故事了

2018-08-24 13:35:16 臭皮匠-小强

一定很多人喜欢看

2018-08-24 13:36:21 臭皮匠-superweb

同情这个骗子

2018-08-24 13:37:08 臭皮匠-大兵

我先给自己银行卡转账了一块，然后改了自己回执单，截图给那骗子，他肯定疑惑为什么还没收到钱，然后我扯什么理由能让他掏钱呢？公司银行卡出现点问题现在转不了？

2018-08-24 13:38:45 臭皮匠-小强

不是

2018-08-24 13:38:54 臭皮匠-超群

集思广益，大家快想办法

2018-08-24 13:39:09 臭皮匠-小强

银行卡不是还有什么大额转款提醒吗

2018-08-24 13:39:21 臭皮匠-大兵

还是什么问题呢，要先让骗子看到钱已经到账的“大饼”，然后他才会发送警惕掏钱出来

2018-08-24 13:39:41 臭皮匠-大兵

银行卡有分类，A类卡不限制转载金额

2018-08-24 13:40:05 臭皮匠-大兵

@全体成员都来集思广益

2018-08-24 13:40:24 臭皮匠-大兵

一天转一两百万都行

2018-08-24 13:41:31 臭皮匠-伟哥

说你是b卡就OK

2018-08-24 13:42:24 臭皮匠-成都牛奶

我靠。你个逗比在干啥？

2018-08-24 13:42:40 臭皮匠-超群

骗到钱，发红包

2018-08-24 13:42:43 臭皮匠-成都牛奶

@臭皮匠-大兵忽悠骗子？

2018-08-24 13:42:47 臭皮匠-超群

@臭皮匠-大兵

2018-08-24 13:43:07 臭皮匠-成都牛奶

带我一个。

2018-08-24 13:43:56 臭皮匠-西瓜

+1

2018-08-24 13:44:06 臭皮匠-牛奶

我来充当个啥角色。然后跟他电话聊聊。

2018-08-24 13:44:10 臭皮匠-大兵

@臭皮匠-牛奶是的啊，赶紧想下面怎么走

2018-08-24 13:44:18 臭皮匠-大兵

他不可能接电话的

2018-08-24 13:44:36 臭皮匠-牛奶

现在玩到哪一步了。

2018-08-24 13:44:55 臭皮匠-大兵

2018-08-24 13:45:05 臭皮匠-大兵

我答应他转账了

2018-08-24 13:45:22 臭皮匠-大兵

然后我改了一张假的转账截图

2018-08-24 13:45:48 臭皮匠-牛奶

就是上面那个支付宝的回执单是吧。

2018-08-24 13:46:19 臭皮匠-大兵

我是这样想的：先让骗子看到钱已经转过去的“大饼”，然后他才会放松警惕，才有机会骗他掏钱出来

2018-08-24 13:46:20 臭皮匠-泽泽

你不是应该要他转给你一点吗

2018-08-24 13:46:22 臭皮匠-大兵

是的

2018-08-24 13:46:54 臭皮匠-牛奶

不同银行到账时间不一样。农行到账本身就很慢。

2018-08-24 13:46:56 臭皮匠-星辰

2018-08-24 13:47:11 臭皮匠-大兵

但是钱虽然转了，但是因为xxx原因他那边还没到账，然后基于这个原因找个借口来坑他的钱

2018-08-24 13:47:38 臭皮匠-牛奶

没有啥原因。农行到账本来就是慢。

2018-08-24 13:47:41 臭皮匠-星辰

真坏

2018-08-24 13:47:45 臭皮匠-牛奶

24小时很正常。

2018-08-24 13:48:03 臭皮匠-垚垚

不要他都识破了就等你转账来

2018-08-24 13:48:04 臭皮匠-星辰

骗子如果让你问银行客服咋还没到账

2018-08-24 13:48:18 臭皮匠-大兵

懂了，但是只是因为慢，接下来不好走，没借口找他要钱啊

2018-08-24 13:48:21 臭皮匠-星辰

你p张假客服聊天图片

2018-08-24 13:49:09 臭皮匠-牛奶

你和这个骗子之间发生了什么。

2018-08-24 13:49:24 臭皮匠-大兵

p张假客服聊天图片....可以，找个银行客户界面做个假的

2018-08-24 13:49:29 臭皮匠-瑞瑞

弄个银行说转这么大额需要对方先转一千担保

2018-08-24 13:49:35 臭皮匠-大兵

没发生什么啊

2018-08-24 13:49:41 臭皮匠-星辰

@臭皮匠-大兵回执编号放个藏头诗

2018-08-24 13:49:44 臭皮匠-星辰

2018-08-24 13:50:06 臭皮匠-枫

把骗子想的太弱智了.....

2018-08-24 13:50:14 臭皮匠-大兵

转一千担保....可靠谱？一般银行应该不会干这种事情

2018-08-24 13:50:20 臭皮匠-大兵

骗子有经验的

2018-08-24 13:50:25 臭皮匠-牛奶

不靠谱。说审核比较靠谱。

2018-08-24 13:51:00 臭皮匠-枫

不亲自查到钱已到账，会信你一张截图.......

2018-08-24 13:51:08 臭皮匠-西瓜

@臭皮匠-牛奶需要骗他钱

2018-08-24 13:51:12 臭皮匠-大兵

骗子经常干这个，对银行转账流程和业务肯定很清楚

2018-08-24 13:51:42 臭皮匠-大兵

所以要找个不可抗因素导致的的借口让他相信

2018-08-24 13:51:56 臭皮匠-枫

不可能的

2018-08-24 13:51:59 臭皮匠-星辰

说银行卡大额转账被抽查需要人工审核，由于骗子银行卡不是vip客户所以要等待

2018-08-24 13:52:05 臭皮匠-星辰

这个行不行

2018-08-24 13:52:09 臭皮匠-枫

除非你是他爹，告诉他

2018-08-24 13:52:41 臭皮匠-小强

我知道了

2018-08-24 13:52:58 臭皮匠-牛奶

等这条路应该不行。得换条路。

2018-08-24 13:52:58 臭皮匠-小强

你就说客服说这两个卡以前没有交易记录

2018-08-24 13:53:04 臭皮匠-小强

转账很慢

2018-08-24 13:53:08 臭皮匠-小强

要等几天

2018-08-24 13:53:15 臭皮匠-小强

可以先小额转款

2018-08-24 13:53:28 臭皮匠-小强

互相转个2000

2018-08-24 13:53:43 臭皮匠-西瓜

或者需要本人到银行转账

2018-08-24 13:53:46 臭皮匠-小强

就可以解除这个大额转账到账慢的情况

2018-08-24 13:54:09 臭皮匠-泽泽

你那边到账没?

2018-08-24 13:54:38 臭皮匠-星辰

这个可以

2018-08-24 13:54:39 臭皮匠-泽泽

是不是额度太大到账比较慢

2018-08-24 13:54:56 臭皮匠-西瓜

2018-08-24 13:55:15 臭皮匠-泽泽

你那边转一两千块钱试试看

2018-08-24 13:55:16 臭皮匠-星辰

就说客服那边说，被风控系统拦截延迟转账了，因为这两张卡从来没有转账记录

2018-08-24 13:55:22 臭皮匠-大兵

@臭皮匠-小强你说的这个情况确实存在，不过不是慢。之前建行客服打电话给我说，要保持新办卡有三到四次转账记录，然后就能升级A卡，然后单日转账不限额度，感觉可以这么入手

2018-08-24 13:55:42 臭皮匠-星辰

说互转就可以解除风控系统延迟操作

2018-08-24 13:55:59 臭皮匠-西瓜

可以，相互转账然后升级A卡

2018-08-24 13:56:00 臭皮匠-星辰

可以可以

2018-08-24 13:56:04 臭皮匠-小强

可以坑钱了

2018-08-24 13:56:16 臭皮匠-西瓜

我们是程序员

2018-08-24 13:56:20 臭皮匠-小强

我很有反坑的潜质啊

2018-08-24 13:56:21 臭皮匠-西瓜

什么可坑钱

2018-08-24 13:56:26 臭皮匠-西瓜

别人给的能叫坑钱吗

2018-08-24 13:57:16 臭皮匠-小强

我怎么这么机智

2018-08-24 13:57:24 臭皮匠-大兵

谁PS速度快，赶紧帮忙P张图和银行客服聊天的截图@全体成员

2018-08-24 13:58:12 臭皮匠-西瓜

电脑没有PS

2018-08-24 13:58:20 臭皮匠-西瓜

2018-08-24 13:59:02 臭皮匠-泽泽

你直接说你这是新卡吗跟我现在的卡没有转账记录

2018-08-24 13:59:18 臭皮匠-牛奶

骗子会让你转的。你放心。

2018-08-24 13:59:41 臭皮匠-西瓜

转账钱真一点

2018-08-24 13:59:46 臭皮匠-西瓜

算一下再转

2018-08-24 13:59:51 臭皮匠-西瓜

别到时候尴尬

2018-08-24 14:00:12 臭皮匠-大兵

随便找个银行的app，找到客服聊天界面，一顿截图，然后改文字成：
银行客服：抱歉新卡单日转账存在交易上线，您可以往该卡中多次转入转出1000金额以上，来升级A类卡，A类卡单日转账不限交易额度

2018-08-24 14:00:32 臭皮匠-泽泽

短信不行的吗

2018-08-24 14:00:43 臭皮匠-大兵

可以得

2018-08-24 14:01:03 臭皮匠-大兵

@臭皮匠-牛奶你说的刚我也想了

2018-08-24 14:01:57 臭皮匠-牛奶

@ 有和对策

2018-08-24 14:02:00 臭皮匠-大兵

就说需要汇款对方账号向本账号转载1000元以上，然后才能升级A类卡

2018-08-24 14:02:16 臭皮匠-大兵

收款方

2018-08-24 14:02:23 臭皮匠-牛奶

那就争取让对方先转了，

2018-08-24 14:02:43 臭皮匠-小强

2018-08-24 14:02:50 臭皮匠-小强

没毛病

2018-08-24 14:03:04 臭皮匠-大兵

谁PS快，P张xxx银行的转账短信通知@全体成员

2018-08-24 14:03:13 臭皮匠-星辰

对了，再附上一句系统提示，您当前转账的卡与您的卡并无任何交易记录，请小心电信诈骗。

2018-08-24 14:03:39 臭皮匠-星辰

毕竟客服遇到这种事情，基本都会有这个提示的

2018-08-24 14:04:43 臭皮匠-西瓜

感觉这是一个诸葛亮和一堆臭皮匠的对决

2018-08-24 14:05:27 臭皮匠-大兵

短信通知内容：您当前转账的收款方与您的卡并无任何交易记录，新卡单日转账存在交易额度上线，您需要让收款方向该卡中多次转入转出1000金额以上，升级A类卡，A类卡单日转账不限交易额度。

2018-08-24 14:06:01 臭皮匠-星辰

也可以

2018-08-24 14:06:20 臭皮匠-小强

转入转出？

2018-08-24 14:06:23 臭皮匠-小强

不对吧

2018-08-24 14:06:26 臭皮匠-大兵

PS大神赶紧出手啊，搞到钱咱们喝酒去，

2018-08-24 14:06:28 臭皮匠-大兵

转入

2018-08-24 14:06:42 臭皮匠-小强

多次转入肯定不干

2018-08-24 14:06:53 臭皮匠-泽泽

你手机里有银行发给你的短信吗

2018-08-24 14:06:54 臭皮匠-大兵

那就单次转入

2018-08-24 14:06:58 臭皮匠-大兵

有

2018-08-24 14:08:32 臭皮匠-西瓜

2018-08-24 14:08:34 臭皮匠-小强

短信通知内容：您当前转账的收款方与该卡并无任何交易记录，新卡单日转账存在交易额度上限，您需要让收款方向该卡中单笔转入1000元以上金额来升级A类卡，A类卡单日转账不限交易额度。

2018-08-24 14:08:58 臭皮匠-西瓜

我刚支付的

2018-08-24 14:09:13 臭皮匠-西瓜

还热乎的呢

2018-08-24 14:09:19 臭皮匠-大兵

@臭皮匠-小强 @臭皮匠-西瓜棒

2018-08-24 14:09:47 臭皮匠-大兵

@全体成员 PS大神速度上

2018-08-24 14:10:08 臭皮匠-西瓜

pS的时候把3上面的5也P一下

2018-08-24 14:10:37 臭皮匠-伟哥

大兵今天玩玩死骗子

2018-08-24 14:13:17 臭皮匠-大兵

@全体成员 ps大神加油，能不能搞一下那骗子看你们了。整天都是骗子骗我们，反过来骗一下骗子不是贼爽的感觉吗

2018-08-24 14:14:05 臭皮匠-伟哥

找UI啊

2018-08-24 14:15:51 臭皮匠-大兵

这样的骗子就是该死，张口让公司转账18万给他。他怎么不去死，死在我面前不咽气我都要一刀刀捅死他。这些人在骗别人的时候从来不想别人的生活和困境，对方完全不在乎你死活，所以要反骗他！

2018-08-24 14:16:22 臭皮匠-西瓜

这是诈骗，兄弟悠着点

2018-08-24 14:18:19 臭皮匠-大兵

无妨，1000块构不成犯罪，最多警察说你两句

2018-08-24 14:18:39 臭皮匠-大兵

而且还是骗子先骗我的，我有理有据怕啥

2018-08-24 14:18:44 臭皮匠-西瓜

你这是摸得门清啊

2018-08-24 14:19:09 臭皮匠-大兵

就像是防卫过当不是犯罪一样

2018-08-24 14:19:37 臭皮匠-大兵

@全体成员可P好了？

2018-08-24 14:20:14 臭皮匠-泽泽

谁来啊我在上班不方便.....

2018-08-24 14:21:19 臭皮匠-西瓜

我没有PS

2018-08-24 14:21:31 臭皮匠-大兵

这也不算是骗，只不过是出口气而已，一天到晚都是骗子在骗我们大众。而且金额这么小警察都不会管的，再说那骗子也不敢报警，除非他自己找死

2018-08-24 14:24:10 臭皮匠-翔子

哈哈

2018-08-24 14:24:34 臭皮匠-泽泽

逗号

2018-08-24 14:25:35 臭皮匠-大兵

@臭皮匠-翔子 6的一B

2018-08-24 14:25:51 臭皮匠-西瓜

兄弟吧上面的5也P一下

2018-08-24 14:25:58 臭皮匠-西瓜

不然有点说不过去

2018-08-24 14:26:06 臭皮匠-翔子

把上面的短信打马赛克

2018-08-24 14:26:06 臭皮匠-西瓜

P个几万

2018-08-24 14:26:13 臭皮匠-泽泽

还有就是时间

2018-08-24 14:26:28 臭皮匠-西瓜

不要打

2018-08-24 14:26:35 臭皮匠-西瓜

打了会不会影响

2018-08-24 14:26:39 臭皮匠-大兵

金额5也P大一点，公司账号不可能有这么小的转账

2018-08-24 14:26:45 臭皮匠-翔子

逗号是字体的原因

2018-08-24 14:26:49 臭皮匠-大兵

不打码

2018-08-24 14:27:33 臭皮匠-翔子

平方的字体在我这逗号只能这样了,不知道咋改

2018-08-24 14:27:33 臭皮匠-小强

我感觉下面的字没有上面的大

2018-08-24 14:27:46 臭皮匠-翔子

放心,一样大

2018-08-24 14:27:46 臭皮匠-西瓜

我感觉应该是支付失败

2018-08-24 14:27:51 臭皮匠-西瓜

不应该扣除18万

2018-08-24 14:27:51 臭皮匠-大兵

@臭皮匠-翔子左上角时间改成下午2:50这样子

2018-08-24 14:27:53 臭皮匠-翔子

我试了

2018-08-24 14:28:01 臭皮匠-大兵

然后我把支付宝账单回执一直搞下

2018-08-24 14:28:21 臭皮匠-西瓜

在P一个+18万的

2018-08-24 14:28:26 臭皮匠-大兵

@臭皮匠-小强字体大小就不用关心了，骗子关心钱

2018-08-24 14:28:47 臭皮匠-西瓜

因为你转账不出去，返还回来，你才能说无法转账

2018-08-24 14:29:04 臭皮匠-西瓜

需要增加“熟悉”度

2018-08-24 14:29:17 臭皮匠-西瓜

你钱都转出去了

2018-08-24 14:29:28 臭皮匠-西瓜

还骗个毛线哦

2018-08-24 14:31:38 臭皮匠-西瓜

仔细想想在搞

2018-08-24 14:31:46 臭皮匠-西瓜

符合不符合逻辑

2018-08-24 14:31:59 臭皮匠-翔子

2018-08-24 14:32:20 臭皮匠-大兵

这个移动到上面，然后原本地方添加一个web前端-上海-西瓜说的转账+18万的失败提示，左上角时间改成下午2:50，辛苦大佬@臭皮匠-翔子

2018-08-24 14:32:55 臭皮匠-泽泽

我觉得还是要注意下字体大小

2018-08-24 14:33:15 臭皮匠-西瓜

没事他把两个都P掉就好

2018-08-24 14:33:31 臭皮匠-大兵

骗子账户信息：

名字：刘随涛

账号：6230520730024147373

开户行：**农业银行股份有限公司新安县新城支行

金额：18万整备注：往来款

2018-08-24 14:37:41 臭皮匠-大兵

骗子催了

2018-08-24 14:38:19 臭皮匠-大兵

他比我们还着急呢

2018-08-24 14:39:32 臭皮匠-西瓜

短信通知内容：您当前转账的收款方尾号7373与该卡并无任何交易记录，新卡单日转账存在交易额度上限，导致本次转账失败，您需要让收款方向该卡中单笔转入1000元及以上金额来升级A类卡，A类卡单日转账不限交易额度。如有疑问请拨打95555[招商银行]

2018-08-24 14:39:38 臭皮匠-伟哥

等一出好戏

2018-08-24 14:39:44 臭皮匠-西瓜

把+18万的信息改成这个

2018-08-24 14:40:26 臭皮匠-西瓜

-18万的你们在想想如何组织语言

2018-08-24 14:41:13 臭皮匠-陈大大

一群程序员戏精

2018-08-24 14:41:18 臭皮匠-大兵

我先把支付宝回执单发给他

2018-08-24 14:41:23 臭皮匠-西瓜

嗯

2018-08-24 14:42:57 臭皮匠-大兵

然后和他说跨行速度比较慢，而且公司这是最新重新办的卡。然后等骗子等了一两天说怎么还没到账的时候，我自己提前主动告诉他因为实新卡，转账额度不够，没办法转，然后配上你们这张图

2018-08-24 14:43:30 臭皮匠-大兵

2018-08-24 14:44:12 臭皮匠-小强

等24小时之后

2018-08-24 14:45:33 臭皮匠-大兵

2018-08-24 14:45:49 臭皮匠-枫

23333

2018-08-24 14:46:07 臭皮匠-星辰

2333

2018-08-24 14:46:47 臭皮匠-秦时

投资失意生意失败销售又不会做跑来做骗子还被一个群的人套路……

2018-08-24 14:47:07 臭皮匠-大兵

我突然很想知道骗子那边以为会到账18万是多么开心的心情

2018-08-24 14:47:12 臭皮匠-枫

@臭皮匠-大兵我以为你特么疯了

2018-08-24 14:47:16 臭皮匠-秦时

残忍

2018-08-24 14:47:25 臭皮匠-星辰

2018-08-24 14:47:34 臭皮匠-秦时

但愿骗子没心脏病

2018-08-24 14:47:36 臭皮匠-大兵

@臭皮匠-枫我哪里疯了？

2018-08-24 14:48:03 臭皮匠-大兵

这些人在我眼里已经不算是人了，他们该死

2018-08-24 14:48:17 臭皮匠-秦时

骗子的确可恶

2018-08-24 14:48:22 臭皮匠-秦时

还好我没被骗过

2018-08-24 14:48:40 臭皮匠-大兵

2018-08-24 14:49:39 臭皮匠-泽泽

你只能说我也不清楚吧

2018-08-24 14:49:51 臭皮匠-小强

客服说48小时以内吧

2018-08-24 14:49:57 臭皮匠-小强

你们觉得呢

2018-08-24 14:51:10 臭皮匠-西瓜

24小时

2018-08-24 14:51:55 臭皮匠-西瓜

2018-08-24 14:52:03 臭皮匠-西瓜

电子汇款到账时间为2～3个工作日。

2018-08-24 14:52:08 臭皮匠-西瓜

这是招商银行的

2018-08-24 14:53:33 臭皮匠-大兵

就说48小时，明天周六然后顺理成章推到下周一工作日

2018-08-24 14:53:37 臭皮匠-大兵

2018-08-24 14:54:12 臭皮匠-小强

招行周六...

2018-08-24 14:54:18 臭皮匠-小强

建行周六上班我知道

2018-08-24 14:55:27 臭皮匠-大兵

2018-08-24 14:56:02 臭皮匠-小强

溜得真快

2018-08-24 14:56:09 臭皮匠-小强

是不是要删你好友了？

2018-08-24 14:56:23 臭皮匠-大兵

这骗子也没有智商，问到项目情况来回就一句回去和你说

2018-08-24 14:56:31 臭皮匠-大兵

不会的，放心

2018-08-24 14:56:47 臭皮匠-大兵

我考虑过来，他钱还没到账不可能删我那么早

2018-08-24 14:57:13 臭皮匠-星辰

2018-08-24 14:57:26 臭皮匠-小强

现在支付宝出了打款可撤回操作

2018-08-24 14:57:41 臭皮匠-小强

只要警察喊停，钱就撤回来了

2018-08-24 14:59:03 臭皮匠-小强

我想把这个写成故事

2018-08-24 14:59:09 臭皮匠-小强

授不授权

2018-08-24 15:00:03 臭皮匠-大兵

一想到骗子满心欢喜以为会到账18万的兴奋心情，然后慢慢掉进我们套里，不管他最后上不上当我们都赚了，精神打击更爽

2018-08-24 15:00:17 臭皮匠-大兵

@臭皮匠-小强授权

2018-08-24 15:00:53 臭皮匠-陈大大

卧槽骗子心想 18万不费吹灰之力

--------------------------欲知后事如何，且听下回分解--------------------------

使用travis-ci自动部署github上的Vue项目并自动展示在gh-pages页面

travis-ci是什么？

一个使用yaml格式配置用于持续集成完成自动化测试部署的开源项目
官网：https://travis-ci.org/

使用travis-ci的目的及应用场景

我们在处理开源项目的时候，编写完业务逻辑代码之后，往往需要进行构建及测试等等操作，每次都花费一定的时间在构建及测试上面，让自己不能集中心思放在业务逻辑代码上面，所以我们使用travis-ci来进行自动部署，push到github上面去之后，会自动触发travis-ci，travis-ci会帮你进行测试和构建（前提是你在yml文件里写了测试和构建），并且自动push到gh-pages上面，让你不用管其他的操作，方便很多。

使用travis-ci的准备

你需要有一个vue项目、github账号、travis-ci账号

登录travis-ci官网

travis-ci 官网地址

使用github账号进行登录

登录之后会自动同步github上你的项目，为你需要持续集成的项目点击开关，之后点击右边的setting进入设置

获取token是从github上面获取的，步骤如下

这里除了删库的权限全都给了，点击下面的Generate token按钮生成token

点击复制token到刚才的travis-ci里面的GH_TOKEN变量设置

现在在项目中添加.travis-ci.yml文件，编写文件，可以参考我的文件

这里有一个问题，有时候打包后页面空白，但是改了assetsPublicPath路径之后，本地测试又连接不上，可以采用这种写法，config->index.js

然后就可以push到github上面去了，push完之后，进入travis-ci你的项目，已经开始构建了

如果像要在项目的README中添加持续集成的图标，可以这样，进入travis-ci，你的持续集成项目，点击标题右边的图标

然后进入你的github项目，setting，修改展示分支，访问地址就可以看到你的项目展示页面了。

文章作者: LeachZhou
版权声明: 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自小桥酒馆！

给自有域名的github-page上HTTPS（Cloudflare小绿锁）

给自有域名的github-page上HTTPS

从Chrome56左右开始，对于没有HTTPS的网站，不符合要求的，都不会出现一把小绿锁。反之，有了小绿锁的网站，标志着这个网站是HTTPS安全的。
假如你没有自己的域名，而是使用着github的子域名（形如xxx.github.io）那么能够自动拥有github的https，无需操心。
但是如果有自己的域名，想要实现自己的域名通过CNAME指向github的page，并加上小绿锁的话，就比较麻烦了。首先我们需要将自己的域名通过CNAME指向github-page。在hexo的source文件夹里创建一个叫做CNAME的文件，内容只需要写上你自己的域名即可。对于我来说就是molunerfinn.com。
通过CNAME指向github-page的页面之后，我们发现，原本github自带的https已经不能再使用了。我们必须给自己的域名想办法弄上https。一开始并无头绪，不过好在我找到了Cloudflare这个解决方案。

注册Cloudflare

第一步当然是注册。Cloudflare是国外非常有名的一家网络服务提供商。它提供的其中一项免费服务就是给我们自有域名加上HTTPS。正好符合我们的需求。
注册成功后添加域名。
然后需要增加几个记录，其中A记录就是指向这192.30.252.153和192.30.252.154这两个IP地址，它们是github-page的ip地址。然后建一个CNAME将www的网址指向我们非www的网址

然后需要将我们的域名的DNS服务商的地址改成Cloudflare要求的两个DNS服务器地址。每个人分配的不一样，而且必须用分配的否则会失效。

这个操作需要在自己的域名服务提供那边修改。一般是48小时内生效。

开启HTTPS

找到Crypto选项，这里我们需要开启Flexible的HTTPS选项。

其实Cloudflare做的事就是，当访问我们的域名的时候，实际上走的是Cloudflare的服务器，这个时候这个阶段的访问是有HTTPS的。然后Cloudflare再去请求我们实际的内容，再将内容返回给用户。这一段是没有HTTPS的。也就是实际上是半HTTPS。不过对于我们静态博客来说，这种半HTTPS实际上已经够我们使用了。
可以看见开启HTTPS真的非常简单，基本不需要额外操作。

重定向

这个时候我们访问https://molunerfinn.com自然走的是HTTPS。但是如果有人访问了http://molunerfinn.com，那要如何跳转到HTTPS的页面呢？CloudFare另一个很棒的功能PageRules就派上用场了。我们可以指定我们的域名强制使用HTTPS，并且当访问是HTTP的时候重定向到HTTPS。这样就能保证用户访问我们的页面都是通过HTTPS的了。

附录

DNS解析

刚开始用CloudFare的DNS服务器，国内域名解析一开始会时断时续。我自己大概是过了24小时之后开始稳定的。所以一开始有可能访问不到自己的博客这是正常的。一开始我还以为是Cloudflare那边问题比较严重还提了一个issue。后来第三天就正常了。

加入HSTS的列表

上面说到，我们有可能访问自己的网站是走HTTP->304重定向->HTTPS。这个是浏览器跟服务器进行了一次通信之后才发生的跳转。那有没有可能做到，访问的是HTTP，但是浏览器识别之后自动转成HTTPS访问，而不经过重定向那一层操作呢？有的。通过HSTS的PreloadList。
可以参考这篇文章对HSTS进行更深入的了解。简单来说，HSTS能够使我们的网站安全性更上一层楼。
还是CloudFare，它家自有的HSTS功能，开启之后就能很好的满足我们的需要。（真是完美了）还是在Crypto选项下，开启HSTS

建议都使用默认的选项。
然后可以去HSTS Preload List的网站把我们的域名进行检查并收录（不能是子域名，必须是一级域名），如果没通过会给出修改建议，按照建议修改就行。如果通过了，就会放入审核列表。之后可以时不时回来看看自己的网站被收录了没有。我是等了快一周才被收录。网上的说法普遍是几周内。所以耐心等待收录。一旦被收录就会应用到主流浏览器上，这样你的网站就是更加安全的网站啦。

记录总结

至此，我的博客迁移工作就做完了。用的因为是Cloudflare的cdn加速，所以在国外访问速度很快，在国内访问的速度会稍慢一些。不过也无伤大雅。最关键的是通过上述的办法，让我的博客能够实现持久化构建，加上了HTTPS的小绿锁，并且成功加入HSTS的PreloadList，还是比较满意。

最后由衷感谢GitHub+Travis-CI+Cloudflare提供的这么优质的服务。

文章作者:Molunerfinn

文章链接:https://molunerfinn.com/hexo-travisci-https/

版权声明:本博客所有文章除特别声明外，均采用CC BY-NC-SA 4.0许可协议。转载请注明来自MARKSZのBlog

在Blog里面调用GitHub API

请先看 Github 官方教程：GitHub Pages，介绍的非常清楚。按照教程做完，就已经有了最原始的 Blog 页面。

如果你打算和我一样在 username.github.io 这个仓库的 Issues 内写博文，那请在教程第一步 Create a repository 时选择 Public 选项，而不是 Private，这与后文介绍的 personal access token 访问权限有关。

我的 Blog 是使用 vue-cli 生成工程模板 vue-webpack-boilerplate 打造的 SPA（单页应用），页面结构、样式都是自己设计并手工打造。

Blog 的内容写在 Issues 内，每个 Issue 就是一篇博文。

Blog 页面通过 Github API 获取 Issues 数据，拿到数据后通过 marked 将 markdown 格式内容转换为 html 格式内容。

Github API 有限流机制 Rate limiting，每小时 API 的调用次数是有限制的。在未认证的情况下是每小时 60 次，在已认证的情况下是每小时 5000 次。

如何认证？具体不详细描述，有兴趣可以去看文档。我的方式很简单，生成一个有访问 public repository 权限的 personal access token，调用 Github API 获取数据时在 Request URL 添加查询参数 access_token=yourRersonalAccessToken 即可。

生成访问 public repository 权限的 personal access token 方式请看下图：

填写 Token description 并勾选 public_repo 之后将页面滚动到最底部点击绿色按钮 Generate token 生成 personal access token

注意！！！不要将 personal access token 完整的写入会提交到 Github repository 的文件内，不然提交后会导致 personal access token 立即失效。

假如 personal access token 是 0123456789，以 JS 为例，赋值给变量请写成 const accessToken = '01234' + '56789'。

这是 Github 的安全举措，当文件提交到 Github repository 时会被扫描，如果在提交的文件内容中发现你生成的 personal access token，则会立即使发现的 personal access token 失效。

署名：Monine
转自：https://github.com/Monine/monine.github.io

Vue 实际项目的总结与学习

1. 如何修改props？

背景：一个自定义弹窗组件，需要显示隐藏，同步给父组件，但是如果修改传入的props，那么就会报错。
解决：父组件调用子组件时使用v-model，子组件同步给父组件时，用 this.$emit('input', false) ，input是固定值，后面的参数是想修改v-model的值。

// 父组件
<modal v-model="show" />
// 子组件
<template>
  <div>
    <div v-if="show">内容</div>
    <div @click="close">关闭</div>
  </div>
</template>
<script>
export default {
  props: {
    /**
     * 是否显示弹窗（v-modal）
     */
    value: {
      type: Boolean,
      require: false
    }
  },
  data () {
    return {
      show: this.value
    }
  },
 watch: {
    value (newVal) {
      this.show = newVal
    }
  },
 methods: {
    close () {
      this.$emit('input', false)
    }
  }
}
</script>

2. /deep/ 失效怎么处理？

解决：

尝试/deep/前加上父class
尝试使用::v-deep
/deep/通常在sass或less中使用，>>>通常在原生css中使用

3. 自定义按钮click事件失效怎么处理？如果不想用native呢？

解决：可以使用@click.native使其触发原生按钮事件。如果不想使用native，可以在子组件中定义click

// 子组件
<template>
  <button @click="_click">
    <slot></slot>
  </button>
</template>

<script type="text/babel">
export default{
    ....
    ....
    methods: {
      _click: function () {
        this.$emit('click')
      }
    }
}
</script>

Git 相关记录

git命令行命令

git add -A  //添加所有发生改变的文件（被新增、修改、删除）到索引用 git add -A, 添加所有未跟踪文件并且提交用 git commit -a。（注意大小写）。
git commit -a -m "提交信息" //提交所有修改内容（包括工作目录及暂存区，但不包括新创建的文件），并记录日志。-a 代表提交所有，-m 代表绑定日志。如果你觉得 git add 提交缓存的流程太过繁琐，Git 也允许你用 -a 选项跳过这一步。 基本上这句话的意思就是，为任何已有记录的文件执行 git add。
git push -u origin master //添加所有发生改变的文件（被新增、修改、删除）到索引用 git add -A, 添加所有未跟踪文件并且提交用 git commit -a。（注意大小写）。
git pull origin master //拉取修改文件
git rm -r -f --cached .idea //对于已经提交到repo的代码，可以用此命令进行移除

git branch //查看分支
git checkout -b dev //新建本地分支
git push origin dev:dev //推送本地分支到远程
git checkout -b dev origin/dev //作用是checkout远程的dev分支，在本地起名为dev分支，并切换到本地的dev分支 ；建立本地没有远程有的分支
git checkout dev //切换本地分支
git branch -d  dev //删除本地分支
git push origin --delete dev //删除远程分支
git remote show origin //查看本地分支和追踪情况
git remote prune origin //删除远程已经不存在分支

git reset --soft HEAD^  //git撤销commit到未提交状态
git reset --soft HEAD"^" // windows系统撤销

git branch | xargs git branch \-d //删除当前分支外的所有分支

更多常用 Git 命令使用教程 http://classfoo.com/ccby/article/cBVvbSu

git命令行删除远程分支

git push -d origin branch-name

提交 commit 的类型，包括以下几种

feat: 新功能
fix: 修复问题
docs: 修改文档
style: 修改代码格式，不影响代码逻辑
refactor: 重构代码，理论上不影响现有功能
perf: 提升性能
test: 增加修改测试用例
chore: 修改工具相关（包括但不限于文档、代码生成等）
deps: 升级依赖

为什么Github没有记录你的Contributions

查看邮箱用户名配置信息

$ git config --global --list
user.name=zhangsan
[email protected]

多个账户不能设置全局

取消全局用户名和邮箱的配置

git config --global --unset user.name
git config --global --unset user.email

配置局部的用户名和邮箱

git config user.name "xxxx"
git config user.email "[email protected]"

修改了文件夹名称，改了大小写，git却提示无修改？

git默认配置为忽略大小写，因此无法正确检测大小写的更改

方案一：配置git
运行git config core.ignorecase false，关闭git忽略大小写配置，即可检测到大小写名称更改，但是这个方案有问题，修改了文件夹大小写提交后，你会发现它只是复制了一份新的文件夹文件，原先的并没有删除。为避免麻烦不推荐这个方案。
方案二：手动修改

git rm xx 删除本地仓库文件（提前做文件备份）
修改文件名，最好修改个字母什么的就没有这么多事了。
git add xx 添加
git commit -m ""
git push

常用CSS查看表

平时要使用的常用CSS比较多，比如多行省略，单行省略，诸如此类，每次都一个一个查麻烦，直接保存我这个网页，打开之后，Ctrl+F查找就行了，美滋滋。

单行文本的溢出显示省略号

p {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

多行文本的溢出显示省略号

p {
   overflow : hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}

单选框美化样式

 input[type='radio'] {
    background: url("../images/enterfor/enterfor_03.png") no-repeat center/cover;
    -webkit-appearance: none;
    width: 23px;
    height: 23px;
    margin-left: -30px;
    border-radius: 0;
    border: none !important;
}

 input[type='radio']:checked {
    background: url("../images/enterfor/enterfor_02.png") no-repeat center/cover;
}

background-size 失效

这样写的话 background-size 没效果

{
background-size:contain;
background:url(xxx);
}

把两个交换下顺序，即换成下面这样就生效了

{
background:url(xxx);
background-size:contain;
}

vscode使用技巧

快捷键操作

搜索所有选中，觉得 Crtl + D 太累… 找到了 Crtl + Shift + L

小程序改写 setData

const originComponent = Component
Component = function (options) {
  const optionsAttached = options.attached
  if (optionsAttached) {
    options.attached = function (...args) {
      const setDataRaw = this.setData
      this.setData = function (...args) {
        console.log('当次setData数据', args)
        setDataRaw.apply(this, args)
      }
      optionsAttached.apply(this, ...args)
    }
  }
  return originComponent(options)
}

蚂蚁金服体验技术部上海团队招聘，兄弟是否有意向沟通一下？

沟通请求 / Talk request

蚂蚁金服体验技术部（AFX）上海团队招聘，兄弟是否有意向沟通一下？

团队博客：https://www.yuque.com/afx/blog

沟通途径 / Let's go

mailto: [email protected]
weixin: chenkan_go

webpack 报错集合

报错：ERROR in chunk common [entry] /dist/js/[name][chunkhash].js Cannot use [chunkhash] for chunk in '/dist/js/[name][chunkhash].js' (use [hash] instead)

ERROR in chunk common [entry]
/dist/js/[name]_[chunkhash].js 
Cannot use [chunkhash] for chunk in '/dist/js/[name]_[chunkhash].js' (use [hash] instead)

解决方法：
热更新(HMR)不能和[chunkhash]同时使用。

如果是开发环境，将配置文件中的chunkhash 替换为hash。
如果是生产环境，不要使用参数 --hot或者取消热更新。

ExtractTextPlugin 打包less无效果

const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module: {
        rules: [
            {
                test: /\.less$/,
                use: ExtractTextPlugin.extract({
                    fallback: {// 这里表示不提取的时候，使用什么样的配置来处理css
                        loader: 'style-loader',
                        options: {
                            singleton: true // 表示将页面上的所有css都放到一个style标签内
                        }
                    },
                    use: [ // 提取的时候，继续用下面的方式处理
                        {
                            loader: 'css-loader',
                            options: {
                                minimize: true  // 开启压缩
                            }
                        },
                        {
                            loader: 'less-loader',
                            options: {
                                minimize: true  // 开启压缩
                            }
                        }
                    ]
                })
            }
        ]
    }

plugins: [
    new ExtractTextPlugin({
            filename: '/css/[name].[hash].css', // 配置提取出来的css名称
            allChunks: true
        }),
]

解决方法：
很简单，其实就是提取出来css路径错误了。

plugins: [
    new ExtractTextPlugin({
            filename: 'css/[name].[hash].css', // 配置提取出来的css名称
            allChunks: true
        }),
]

webpack 用url-loader打包less里面的图片并显示，html里面不行

解决方法：
使用html-loader。

npm i html-loader -s

{
                test: /\.html$/,
                use: {
                    loader: 'html-loader',//可以处理在html中的img图片
                    options: {
                        // ignoreCustomFragments: [],
                        // root: path.resolve(__dirname, 'src'),
                        // attrs: ['img:src']
                    }
                }
}

如何更新自己写的npm包（模块）?

前提：你已经写了一个npm包，然后已经上传到npm中，那么它的版本就是1.0.0；

更新版本

使用命令：npm version <update_type>进行修改，update_type 有三个参数，
第一个是patch, 第二个是minor,第三个是 major，
patch：这个是补丁的意思，补丁最合适；
minor：这个是小修小改；
major：这个是大改咯；

具体咋用：
比如我想来个1.0.1版本，注意，是最后一位修改了增1，那么命令：npm version patch 回车就可以了；
比如我想来个1.1.0版本，注意，是第二位修改了增1，那么命令： npm version minor 回车就可以了；
比如我想来个2.0.0版本，注意，是第一位修改了增1，那么命令： npm version major 回车就可以了；

发布新版本

cd 文件夹
npm publish

常用

2018 年度总结

2019年都过了两周了，才开始写2018年度总结，我不是不想写，只是有时候可能被其他事耽搁了，而且自己的拖延症已经晚期了，尽管如此，自己还是要治好拖延症。

2018年过后，我的感受是，我想赚钱，我尝试了解市场，了解市场的运营模式及变现方式，最适合我的方式，肯定是技术与运营结合的，只有优秀的运营才可以将技术最大利益化，得到最大化的正反馈后，技术才能持续下去。

2018年底有些焦虑，可能是月光的焦虑，可能是没做成什么事情的焦虑，在这里谢谢我家的小可爱，在我焦虑的时候，耐心的开导我，开导过后，我的焦虑降低了不少，我也是继续学习，尽量控制好自己的焦虑。

工作

今年年中的时候，写过一篇年中总结，总结了上半年的一些事情，不过顺带再提一提吧。

4月份从老东家跳槽，入职了新公司，公司的前端流程还是老一套，想要进行改造，奈何公司运维业务外包出去了。

来到公司之后认真工作，并且也是把自己的博客改造成基于vue.js+github api+Travis CI的了，以后可能都会有这个习惯，学习一种新的东西，先往博客上试验试验。

6月份玩了玩nodejs，写了一些爬虫，配合express和mysql写curl是完全没问题了。

7月份配置了webpack多页面脚手架，毕竟是工程化的基础，也很方便的解决了很多事情。

9月份的时候，自己写了一个壁纸小程序，改版了几次，自己看的舒服了。尽管用的人不多，也还是连续更新了4个月。

在2018年年底的时候，我躁动不已，不想呆在公司了，不是我不想呆，我当然想在一个地方一直呆下去，能够沉淀技术多好，没有原因，谁愿意换公司。

今年真的让我觉得自己有些无所事事，一直想要做出些什么，我明白，在能力不足够撑起自己梦想的时候，唯有学习。

生活

🎥电影

说实话，今年看的电影没有去年多了，去年看的电影有五六十部，今年看的很少了，2019年一周一部好电影，看完后再豆瓣打卡。

💪健身

5月份开始健身，请了私教，也是练了2个多月，然后8月份的时候，自己出去租房子住，换了地方，健身耽搁了，2019会将健身的过程放在家里，随时都可以健身，也更方便。

🚄旅游

10月初，去苏州玩了一次，把那边最著名的两条小吃街逛了个遍，还是很开心的，尽管人很多。

✍️练字

很后悔，今年的练字计划一点没执行，可能说到底，打心里还是觉得不重要，但其实能写一首好字是一件很秀的事情，哪怕是过年去亲戚家，写个对联或者喜帖什么的，也不会唯唯诺诺的说自己字写得不好看。2019年，字帖刚买不久，每周练习一点。

⛳英语

2019年的计划，将学习英语加到计划中，从词汇量开始，每天记一点，固定时间进行测试。

📚看书

看书的计划对我来说有点难，前几天买了《哈利波特与魔法石》全英文版，希望可以看完，看完后可以买新的。自己还有一本《人性的弱点》，一直吃灰，不知道今年有没有机会看。另外还想看看心理学方面的资料，看过一些，不够系统。

希望可以在2019年一直坚持下去的事情，健身、英语、练字。

我希望可以健身成这位大佬这样，前几天从这位大佬的博客看到的，很棒，所以我2019年的健身目标也是这样。

2019

这是2019新年新立的flag。

2019年希望自己改掉拖延症，不论是生活还是工作学习，这是一个成为优秀人的必须素质。

2019年在工作上希望可以稳步上升，要做的事情和学习的东西，我都写在了自己的trello上面，明年这时候再来看看吧，希望可以看到满屏的Done。

希望在2019自己可以变得认真，变得开心。

2018 年中总结

转眼2018年已经到了年中了，一开始没想起来写，但是不小心点了掘金的沸点之后，有个年中总结的活动，这时候才想起来写个总结，写年中总结不是为了得奖品，完全是回顾总结自己上半年，为下半年进行准确的规划和执行。

工作

上半年前半段在上家公司，过了个年会，拿了个优秀员工奖和一个小红包。

给上家公司完成了两个不小的项目、不少的小项目和维护不计其数的代码，不小的项目一个是下单支付评价促销的商城系统及后台，另一个是类似滴滴打车的项目，demo。之后在3月底的时候我就离职了，入职了现在的东家，现在在公司负责巨多移动站的改版及PC站一些推广的页面，为什么巨多呢？

移动站加PC站，我总共涉及到的有14个站点，移动PC对半，而且公司采用gitlab版本控制，每次上传到服务器都是个问题，中途我了解了一些可以提高上传效率的方案，所以后期我会在这方面研究一下，有方案的大兄弟们也可以提下，帮助下小弟。

另外下半年我还会在前端脚手架方面进行研究，因为我记得有个大佬说过，最适合的脚手架都是自己配出来的，可以提高不少效率。

学习

完成了总结普通项目中webpack的使用
把自己需要的一个插件编写好发布到npm上
使用Vue来重构自己的个人网站
学习持续集成
了解编写可扩展、易维护的代码

生活

自己从五月份办了健身卡开始健身，并...请了私教，真的蛮贵的。

因为自己是健身0基础，本身自己又是瘦弱体格，不过现在好了，增肌训练不吹不黑还是有效果的，明显可以看到胸肌了，基本一周5练。

3月底的时候和女朋友在一起了，没错，就是我离职的时候，然后就去了她那边玩了一圈。（看见掘金这么多卖狗粮的，我不能视而不见）

学会了做一些菜，并且目前做的还可以，发现自己喜欢上做饭了，一有空就自己做饭吃，外面的饭菜或者外卖实在是吃的有点不喜欢，家里人一直希望自己学着做几个菜，现在好了，说不定成为大厨。

在旅游方面，今年年的旅游计划还没有进行，准备在国庆假期的时候和女友一起出去旅游。

在练字方面，因为自己的字实在不好看，俗话“字如其人”，去年就想着今年要练字，还没练，实在惭愧。

在看书方面，三月份买了一本《人性的弱点》，可是一直没看，不过手机上的微信阅读看了一些书，《人类简史》《你一年的8760小时》，还关注了一些心理学的书，也一直没看。下半年要少玩点游戏了，因为最近一个月上下班都在玩游戏。

展望下半年

配置一个适合的前端脚手架
Vuejs源码解析
发布一个小程序在自己的公众号上（原因是看到去年的一个圣诞帽小程序火了，想做个工具类的）
发布一个Vue插件
将个人网站SSR化
用Nodejs配合其他的写点东西
了解单元测试相关知识
学习桌面应用开发，可以采用Electron-vue进行开发（选修）
学习React，了解React与Vue的差异（只有自己真正了解才知道差异在哪）
去旅游一次
看书达到5本
坚持健身，增重10公斤，体脂达到....（还没测过体脂，尼玛）
运营自己的公众号，不发技术文，是一个挑礼物的公众号，【陪你挑礼物】
提高在在掘金活跃度及博文质量数量
最后当然是希望升值加薪啦

看一下，下半年的事还有很多啊，要加油。

更新记录

怎样简单保存下载 Windows 10 随机聚焦锁屏壁纸？

Windows 10 上一项功能 Windows 聚焦，它会自动随机下载并更换锁屏界面的壁纸，让你每次打开电脑都有不一样的视觉享受。这些高清锁屏壁纸往往都很精美，很多视觉冲击力十足，非常值得收藏，如果你遇到了非常喜欢的壁纸，不妨参考这个保存 Win10 锁屏壁纸的教程将其提取出来……

提取教程

按下键盘的「Win+R」，调出“运行”窗口，然后输入下面的路径并点确定：

%localappdata%\Packages\Microsoft.Windows.ContentDeliveryManager_cw5n1h2txyewy\LocalState\Assets

全选文件夹里面的文件复制
在桌面新建文件夹，将文件粘贴到里面去，复制文件夹路径（不可以直接在源文件里面改，会影响到windows系统）

按下键盘的「Win+R」，调出“运行”窗口，然后输入CMD并点确定，在控制台里面输入以下命令（cd+空格+你刚才复制的路径可以直接粘贴路径）

cd C:\Users\ibf\Desktop\新建文件夹

按确定后输入以下命令

ren *.* *.jpg

这时候回到桌面的新建文件夹里面就可以看到聚焦壁纸啦。٩(๑>◡<๑)۶

如何发布一个NPM包呢？

开始做之前nodejs默认是要安装的，怎么安装自行百度其他教程。
首先在npm网站上注册一个账号，这个账号之后会用到。
npm网站注册地址：https://www.npmjs.com/signup

注意：在注册的时候有可能会遇到注册失败或者503等问题，比如：Account creation denied. Please contact [email protected].遇到这种问题，不是网络问题，这时候联系官方人员，他会帮你处理（...想办法刷锅），不过一般都可以啦。

1.编写模块

（1）新建一个目录如npm-test-publish-xxx，后面的xxx最好填写你自己专属的昵称或者其他，因为在后面发布的时候，如果遇到相同的名称，是发布不了的。

（2）新建文档npm-test-publish-xxx.js，编写代码，如下

exports.sayHello = function () {
    return "Hello,world!";
};

（3）发布到github，这样在package.json文件中可填写repository地址，可实现自动更新包

2.初始化包描述文件

使用<npm init>命令生成package.json文件

3.登录包仓库账号

登录，使用<npm login>登录已有账号
注意：如果注册或登录过程中出现如下报错，可能是使用了国内镜像导致的，是通过命令<npm config ls -l|grep config>查看，找到userconfig对应的地址，删除该文件即可。

4.上传包

使用<npm publish npm-test-publish-xxx>上传包
注意：不管是刚注册的账号还是已登录的账号，必须去官网发送邮箱验证链接，验证邮箱后才可以上传包。

5.安装包

使用<npm install npm-test-publish-xxx>安装包，当前目录会生成node_modules目录，package-lock.json文件。
注意：如果当前目录与刚才编写模块的目录在同一个父目录下，则并不会下载，而是会在node_modules下生成包目录，然后该包目录到发布的目录会建立一个软连接。

6.管理员权限

（1）查看管理包的所有者
npm owner ls <npm-test-publish-xxx>
（2）添加/删除包的拥有者
npm owner add <user> <package name>
npm owner rm <user> <package name>

7.分析包

使用<npm ls>，可分析出当前路径下能够通过模块路径找到的所有包，并生成依赖树。
在使用NPM过程中，如果不能确认当前目录下能否通过require()顺利引入想要的包，这时可以执行<npm ls>分析包。

8.删除/撤销

删除要用force强制删除。超过24小时就不能删除了。自己把握好时间。
npm --force unpublish npm-test-publish-xxx

----------------------------- 2018/08/29 更新 -----------------------------

如果想要在发布包对应的github仓库里面README加上类似这样的图片及链接

可以在这里操作，网址：https://nodei.co/

可以在这里操作，网址：https://shields.io/

可以在这里操作，网址：https://travis-ci.org/ 参考 #8 ( 博客 )

计算器测试

常用正则表达式

提取所有符合「介于两个特定字符串AAAA和BBBB之间」

(?<=AAAA)((?:(?!AAAA).)*?)(?=BBBB)

Vue如何动态设置title？

这篇文章应该在一个星期之前就应该写出来了，一直有其他事情，没有写。这个问题主要是在维护个人网站的时候，有了这个需求，一方面动态设置title可以利于SEO，也可以在用户体验上有所提升。

第一步

在main.js中设置自定义指令，我们这里判断的意思指的是，如果DOM元素上没有data-title这个自定义属性，则显示‘等待中...’，如果有则返回设置的内容。

我们这里使用到了自定义指令，如果有同学对自定义指令不太了解的，可以点击这里了解一下如何使用及使用场景等。

Vue.directive('title', (el) => {
  if (el.dataset.title === undefined) {
    document.title = `等待中... | 小桥酒馆`;
  } else {
    document.title = `${el.dataset.title} | 小桥酒馆`;
  }
})

第二步

可以在每个页面的根元素上进行设置自定义指令及自定义属性，

<div id="index" v-title data-title="首页"></div>

结语：做完以上操作就可以看到效果啦，需要看到预览效果，可以查看本人博客中的文章效果。

我想问一下你的美工是哪里找的？我也想做个博客正愁没有美工呢

问题类型 / question type

项目版本信息 / Project version information

问题重现 / Problem recurrence

功能请求 / Feature request

关于那些IDE的坑

1. 使用vue-cli，热替换不起作用怎么办？？

webstorm默认保存在临时文件，把settings=>appearance=>system=>synchornization=>最后一项勾去掉

2.打开项目慢，怎么让webstorm不加载node_modules文件？

Setting -> Editor -> File types -> Ignore files and folders
在那添加上 node_modules。就会默认被忽略。全部项目都按这个默认。想把node_modules拿回来的用下面的方法就能拿回来了。
最好移除 .ignore 插件，宁可删错不能放过。
Setting-> Directories
是针对当个项目，在想忽略的文件夹点一下，再点上面的Excluded按钮就会排除它了。想拿回来的同样再取消Excluded就可以了。
最好删掉根目录下的 .idea 文件夹，让webstorm重新建立索引，以免出现卡死。

close

macOS - 给Terminal终端命令行配置网络代理的方法

与浏览器不同，mac 的终端默认并没有开启代理模式，也就是说即使我们电脑安装了 SS/V2ray 等代理客户端，在终端中也是无法科学上网的。下面通过样例演示如何对终端配置网络代理。

1，确定代理客户端的端口
首先我们打开我们使用的代理客户端设置页面，查看其开放的 HTTP 端口，比如这里使用的端口是 1088

2，配置代理
（1）bash 是 macOS Mojave 及更低版本中的默认 Shell 终端。要对其进行配置，首先执行如下命令修改用户全局配置文件：

vim ~/.bash_profile

然后在其里面添加如下内容：

alias proxy='export http_proxy=127.0.0.1:1088;export https_proxy=$http_proxy'
alias proxyOff='unset http_proxy;unset https_proxy'

最后执行如下命令使配置生效：

source ~/.bash_profile

（2）而从 macOS Catalina 版开始，Mac 将使用 zsh 作为默认的 Shell 终端。要对其进行配置，首先执行如下命令修改用户全局配置文件：

vim ~/.zshrc

然后在其里面添加如下内容：

alias proxy='export all_proxy=socks5://127.0.0.1:1080'
alias unproxy='unset all_proxy'

最后执行如下命令使配置生效：

source ~/.zshrc

开始测试
（1）首先我们使用 curl 命令查看终端目前的 IP，从结果来看确实使用的是国内的 IP 地址：

curl ipinfo.io

（2）接着执行如下命令开启代理模式：

proxy

（3）再次使用 curl 命令查看可以发现变成了国外的 IP（代理服务器的 IP）：

（4）如果需要关闭代理模式，则执行如下命令即可：

unproxy

附：配置 Git、NPM 代理
经过上面的操作开启终端的代理模式后，对于系统级命令已经完成了代理。但其他譬如 git 或者 npm 在使用时还需要环境变量支持，否则无法使用代理。

1，配置 Git 代理
（1）执行如下命令可设置代理：

git config --global http.proxy http://127.0.0.1:1088
git config --global https.proxy https://127.0.0.1:1088

（2）执行如下命令则取消代理：

git config --global --unset http.proxy
git config --global --unset https.proxy

2，配置 NPM 代理
（1）执行如下命令可设置代理：

npm config set proxy http://127.0.0.1:1088
npm config set https-proxy http://127.0.0.1:1088
npm config set strict-ssl false

（2）执行如下命令则取消代理：

npm config delete proxy
npm config delete https-proxy

原文：https://www.hangge.com/blog/cache/detail_3138.html

从0搭建前端脚手架

最近公司经常会做一些推广页面，这些推广页面上服务器之后，有时候需要更新一些不合适的内容，但是如果修改之后直接上传，原来浏览过页面的浏览器就会有缓存，需要强制刷新才可以，所以需要通过postcss构建生成hash文件名称，那这样就动手给公司做一个前端脚手架吧。

优秀博文收藏

这里当作是平时优秀文章的一个整理集合，方便自己今后查阅，也会持续更新。

JavaScript

如何在 JS 代码中消灭 for 循环

Vue

性能优化

生财之道

【教你赚钱】5 分钟教你成为会赚钱的独立开发者

VSCode插件

npm

npm切换淘宝镜像

Mac 如何在线看电视？直播源有哪些？

这里以Mac做参考。

下载VLC播放器，安装后打开。地址：

https://www.videolan.org/vlc

复制直播源，iptv这个项目长期维护，直播源：

https://iptv-org.github.io/iptv/index.m3u

（如果有更新可以去这里复制新的，地址： https://github.com/iptv-org/iptv）
目前看好像没有**几个频道，我想看**6套，呜呜。

切换VLC播放器语言，点 save，强制退出后再打开就是中文了。

打开网络

如果出现这样，多试几次，一般科学上网会好些，或者直接在浏览器打开直播源，下载下来，以后方便直接加载。

成功的话会显示这样，点击看电视就行了。

Travis-ci出现“module.js:549 throw err; ^ Error: Cannot find module './lib/source-map-generator'”

场景还原：本来只是为了修改几个小问题，本地也没有任何问题，但是push之后，travis-ci走构建的时候出现了错误，一度导致我有点小懵逼。

错误提示：

> node build/build.js
module.js:549
    throw err;
    ^
Error: Cannot find module './lib/source-map-generator'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/home/travis/build/[secure]/blog/node_modules/postcss-reduce-transforms/node_modules/source-map/source-map.js:6:30)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/home/travis/build/[secure]/blog/node_modules/postcss-reduce-transforms/node_modules/postcss/lib/previous-map.js:9:18)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR!     /home/travis/.npm/_logs/2018-06-19T09_42_10_772Z-debug.log

这其实是node_modules包里的问题，我在网上一番搜索，试着将本地的node_modules删除重新npm i，push之后发现还是这样的错，然后想着本地没有问题，那是不是ci的问题呢，这样就想到了travis-ci.yml里面的东西，只要将缓存node_modules的代码去除即可。

cache:
  directories:
    - node_modules

这样就不会缓存node_modules了，从而问题解决。

Gitlab强制推送提示"You are not allowed to force push code to a protected branch on this project."

场景还原：公司上新网站，需要进行百度等平台审查，其中不能出现敏感字眼等，所以将网站中的字词问题修改了，本来的意思就是现在随便修改，之后再Gitlab上回滚即可，现在审查过了，需要进行回滚，可是回滚时强推出现了没有权限的问题，明明权限已经是master了，但还是强推不了。

强制推送命令

$ git push -u origin master -f

推送命令后出现了这样的情况

E:\xxx>git push -f origin master
Password for 'http://[email protected]':
Total 0 (delta 0), reused 0 (delta 0)
remote: GitLab: You are not allowed to force push code to a protected branch on this project.
To http://git.xxx.cn/xxx/xxx
 ! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'http://[email protected]/xxx/xxx.git'

"GitLab: You are not allowed to force push code to a protected branch on this project."
提示没有权限强制推送

后来在网上进行一番搜索，发现了问题

就是这里，左边的意思是受保护的分支，受保护的分支不允许进行强制推送，解除掉受保护的分支即可，UnProtect解除保护，然后再次进行强制推送命令$ git push -u origin master -f。

推完之后再回到这里进行重新保护master分支，选择分支，点击Protect即可