Vercel国内无法访问解决方案

之前把博客转成Hugo，然后整个托管到Vercel上面了（参考文章：Typecho博客迁移到Hugo），本来访问还是好好的，结果最近有朋友和我说已经不能访问了。本来以为是他们各别的问题，因为我一直可以访问（可能是长期使用公司VPN的原因），结果最近使用老的Windows电脑看的时候发现，果然不能访问了。 找原因 网上搜了一圈，结果原因就是你懂的。 P个S，好用并且免费东西还是没逃开这个结局。 找解决方案 换个主机 官方解决方案 首先推荐方案2，官方背书的解决方案值得推荐。 方案1要花钱，但可以保证独立IP，SEO收录要好一些，放香港访问速度还可以，下面记录一下折腾过程。 官方解决方案 将 A 记录从 76.76.21.21 改成 76.223.126.88 官方建议将 cname 从 cname.vercel-dns.com 修改为 cname-china.vercel-dns.com 参考：Vercel Status Status - Errors Accessing From China 买个主机 域名没备案，使用阿里云国内方案的行不通，那就考虑香港的主机了。虽然阿里云也有香港的主机，不过298一年对我来说有点贵（有钱的可以尝试哈，毕竟稳定好用），主机我选用了之前一直使用的校长的主机：篱落主机，价格适中，带独立IP，我买的是虚拟主机，有条件的可以考虑VPS。 我买的是上面的那款，有兴趣的可以点下面的链接看看哈。 篱落主机 ————更新————– 现在已经切成成阿里云的轻量应用服务器了，比上面的要稳定好多。PS：现在主机做起来不容易，竞争激烈，小运营商越来越少了。 配置自动部署 Vercel一个好用之处就是代码提交之后什么也不用去操心，会自动把内容给你部署上去。如今我们要自己实现这个过程，有读者可能会问为什么不用FTP直接上传上去，你当然可以这么做，但当你的文章有几百这个量级之后，相信我，每次上传的时间会让你疯的，并且每次还要用FTP工作上传好累，还不如使用Wordpress这种解决方案。 于是我们需要找一个自动部署的工具来替我们自动化完成这个工作，其实就是相当于找一个CI了。常见的免费可用的CI工具有2个，一个是Traivs-ci，一个是Github Action，我使用的是Github Action。关于Git Action的使用教程我就不赘述了，详细可以参考：GitHub Actions 分享一下我的配置： # This is a basic workflow to help you get started with Actions name: CI # Controls when the action will run. on: # Triggers the workflow on push or pull request events but only for the master branch push: branches: [ master ] pull_request: branches: [ master ] # Allows you to run this workflow manually from the Actions tab workflow_dispatch: # A workflow run is made up of one or more jobs that can run sequentially or in parallel jobs: # This workflow contains a single job called "build" build: # The type of runner that the job will run on runs-on: ubuntu-latest # Steps represent a sequence of tasks that will be executed as part of the job steps: # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it - uses: actions/checkout@v2 with: submodules: true # Fetch Hugo themes (true OR recursive) fetch-depth: 0 # Fetch all history for . 继续阅读

开发一个imgcook上传至7牛的插件

继续折腾imgcook的使用，最近imgcook使用了一段时间，配合之前写的uni-app DSL，工作效率有了不少提升。公司使用的是7牛的CDN，每次都要把本地的图上传上传一下，有点小折腾，于是想用一个插件来解决这个问题。

PS: 本文只是一个折腾的过程，目前插件没有在Windows及Linux下测试。

继续阅读

解决 Oh My Zsh Insecure Completion Dependent Directories Detected

今天把Mac重新安装了一下，之前Windows系统被我干掉了，没有别的原因。用Mac装Windows这事儿，如果只是偶尔用用倒是还好，如果想长期使用，还是建议专门找个Windows的电脑。使用MacBook装的话比较伤电池，并且触摸板之类的体验也远不如原生的MacOS。

继续阅读

Github Branch Merge 自动发邮件

最近在多团队前端开发的Git Merge操作的时候出了一些问题，有的代码合并完后会把一部分团队的代码给Merge没了。后来团队讨论了一下，除了协作方式及Git使用的一些规范之外 ，决定在Merge的时候加一个人工审核机制，让各团队的负责人审核一下自己的代码还在不在。之前的做法是每次Merge通知团队，让他们自己来看，确认没问题自己发邮件给总负责人。有点低效，于是尝试找一些自动化Merge发邮件的方法。 方案一：Webhook Github支持Webhook机制，可以在检测到Merge操作后，自动发送邮件。 这只是第一步，这里要填写一个webhook的url，所以需要自己run一个服务来接收这个webhook，然后发送邮件。因为这个方案在公司内部不好推，Effort也比较大，就放弃了。 方案二：添加reviewer 在提PR的时候，可以选Reviewer，这时候把相应的人选择上，只要他开了邮件提醒就会收到Merge的邮件。 方案三：Comment中@ 这也是比较推荐的一个方案，在PR不方便添加Reviewer的时候，可以在PR的Comment中添加@，被@的人也会收到邮件。

uni-app中NPM打包机制及优化方案

团队使用uni-app来开发微信小程序，开始用的挺舒服的，后面项目大了，发现项目不太好维护，并且主包会超，于是做了2个方案。一个是将公有的组件及方法抽象成公共的NPM包（团队搭建了私有NPM），一个是使用了小程序分包机制。这种方法开始有一定效果，后来发现主包体积还是飞速扩张，但主包的业务基本没加，于是探究了一下uni-app中针对NPM打包的优化方案。本文尝试从以下几个方面做个总结。

继续阅读

使用VSCode的Snippets功能实现快速模板化输入

最近使用React+Ant Design进行一个网站开发，这个客户的网站有个特点，按钮特别的多。Ant Design 的 Type 有很多种，如下： primary | ghost | dashed | link | text | default 这几个Type分别对应了不同的Button样式和状态，每次遇这种情况都要去找Antd的API查看，有点低效，于是想找一种快捷的方式，大约看了一下VScode的Snippets里带了Choice这种功能，正好满足我的需求。 先添加一个Snippet 自定义snippet的方法可以参考：官网 下面是我自定义的： "Button": { "prefix": "bt", "body": [ "<Button type=\"${1|primary,ghost,dashed,link,text,default|}\">primary</Button>" ], "description": "Ant Design Button" } 使用效果 在.jsx文件中输入bt，就会出现如下的场景。 是不是方便多了~

使用imgcook辅助前端开发

在之前的文章《开发一个基于uni-app的imgcook DSL》中开发了一个团队使用的uni-app的DSL，基本可以凑合使用了。前几天在团队内做了个imgcook小分享，这里也记录一下使用imgcook辅助前端开发的过程。

继续阅读