Nick Shek's Blog

網站遷移完成：從 Sculpin 到 VuePress

終於把網站遷移完成，使用了自己最近比較熟悉的 VuePress。沒想到，8 年後，在 AI Agent 的協助下，幫我提交 pull request，在我需要極少的人為 coding 介入下，完成了這個任務。而這個 post 也是透過 send message 給 agent 的形式發佈的呢！

遷移歷程

這次遷移經歷了一些波折：

初期嘗試 VitePress
最開始想用 VitePress（Vue 3 + Vite），但遇到了一些配置問題。
回退到 VuePress v1
嘗試使用 VuePress v1，但發現 Vue 2 已經 EOL，而且有 105 個安全漏洞。
最終升級到 VuePress v2
- 從 Vue 2 升級到 Vue 3
- 安全漏洞：105 個 → 0 個
- Build 時間：約 36 秒
- 使用 Vite bundler，速度快很多

AI Agent 的幫助

整個過程中，AI Agent 幫我：

自動處理 Git 操作（fetch、merge、commit、push）
修復 package-lock.json 問題
解決 GitHub Actions 部署配置
修復文章中的語法問題（例如 <script> 標籤導致的 webpack 錯誤）
甚至幫我寫這篇文章並發 PR！

技術細節

框架： VuePress v2.0.0-rc.26
Vue 版本： 3.5.13
Bundler： Vite
部署： GitHub Actions → GitHub Pages
文章數： 34 篇（從 2014 年至今）

感想

科技進步真的很快。8 年前寫第一篇 blog 時，還在手動寫 HTML、CSS。現在只需要跟 AI 對話，它就能幫我完成大部分的技術工作。這篇文章本身就是最好的證明——我只是用自然語言告訴 AI 我想寫什麼，它就幫我整理好格式、創建 PR，甚至處理了 Git 操作。

期待未來會有更多這樣的自動化工具！🚀

Nick Shek2/2/26About 1 min

在Centos7下安裝Chrome

輸入以下指令

vi  /etc/yum.repos.d/google.repo

貼上以下內容

[google64]
name=Google - x86_64
baseurl=http://dl.google.com/linux/rpm/stable/x86_64
enabled=1
gpgcheck=1
gpgkey=https://dl-ssl.google.com/linux/linux_signing_key.pub

之後再輸入

sudo yum install -y google-chrome-stable

Nick Shek10/15/18Less than 1 minute

在Cento 7下使用Cisco AnyConnect Secure Mobility Client

若你只有windows 或 mac os 版本的Cisco AnyConnect Secure Mobility Client，而想在Centos 下使用和Cisco AnyConnect Secure Mobility Client功能相同的軟件，可以考慮安裝openconnet

sudo yum install openconnect

使用方式:

sudo openconnect <vpn ip>

輸入username + password即可

留意到resolv.conf 更新了

sudo cat /etc/resolv.conf

按ctrl + c 即可斷開VPN連接

Nick Shek10/14/18Less than 1 minute

差不多半年沒有更新blog了

這半年都沒有把自己遇到的IT問題更新在這個blog呢，看來還是需要加把勁更新一下個blog呢。不進則退。

這半年接主要觸到的而掌握技術有 ansible 和 vue.js + nuxt + webpack + es6 等等，但做了web developer這麼耐，居然還未在這個網頁有好好整理自己曾經開過而闗閉了的網站，還有希望在不久的未來，建立一個多人使用的高質素網站呢!畢竟我是一個developer，沒有屬於自己的網站也不太合理吧。

Nick Shek9/24/17Less than 1 minute

學習Latex

近期對Latex相當有興趣，之前曾經稍為在Wiki了解過Latex，覺得Symbol好像看起來好像好複雜，所以便提不起興趣學了。直至近期發現好多整齊漂亮的pdf文件原來都是由Latex的編譯器建立，便開始想了解一下，當學習一個全新的markup language。以下的範例會建立一個pdf文件，簡單地記綠「Today I Learned」，好像https://github.com/thoughtbot/til 或 https://github.com/jbranchaud/til，只是用Latex編寫而已，雖然這個情況或者用markdown會比較合適，但是用來練習Latex也不錯:

首先安裝 texlive:

sudo apt-get install texlive-full

Text Editor 我覺得用atom便好了無需再額多安裝 texmaker。反正本身電腦只使用了128G SSD，沒有太多空間...

之後把以下原始碼儲存為main.tex，不妨花點時間了解一下latex語法，推薦不妨抽少少時間看看Latex in 157 minutes


\documentclass{article}

\usepackage{hyperref}

\RequirePackage{fontspec}
\RequirePackage{xeCJK}

\setCJKmainfont{Droid Sans Fallback}
\XeTeXlinebreaklocale "zh"
\XeTeXlinebreakskip = 0pt plus 1pt

\title{Today I learned.今日我所學}
\author{Nick Shek}
\date{2017-02-07}

\begin{document}

\maketitle

\clearpage

\tableofcontents

\clearpage

\section{MySQL}

\begin{itemize}
\item Setting up MySQL replication without the downtime: \href{https://plusbryan.com/mysql-replication-without-downtime}{https://plusbryan.com/mysql-replication-without-downtime}
\end{itemize}

\section{Latex}

\begin{itemize}
\item Latex 中文化解決方案:
  \begin{itemize}
    \item \href{https://goo.gl/6ajvrM}{https://goo.gl/6ajvrM}
    \item \href{http://pangomi.blogspot.hk/2012/11/latex-in-ubuntu.html}{http://pangomi.blogspot.hk/2012/11/latex-in-ubuntu.html}
  \end{itemize}
\item Create Table of contents in Latex \href{https://www.sharelatex.com/learn/Table\_of\_contents}{https://www.sharelatex.com/learn/Table\_of\_contents}
\end{itemize}





\end{document}

確保Droid Sans Fallback字型已經安裝後，執行

xelatex main.tex

如無意外，便能成功建立一個pdf，及中文字型能正確顯示。

參考了不同網站後，現在總算能輕鬆建立pdf，而pdf本身能顯示中文。了解Latex基本Symbol後，其實建立一份Latex 沒有想像中那麼複雜。

如有興趣，也不妨看看: https://github.com/nickshek/latex-til

有時間的話會不定期更新

Source: http://milq.github.io/install-latex-ubuntu-debian/

Nick Shek2/6/17About 2 min

用ansible去傳送電子郵件

Ansible在前幾年是一個非常熱門的開源項目，以我理解ansible其中一個功能是可用來部署應用程式，但是我個人覺得部署應用程式暫時有 capistrano或deployer-php也非常足夠，同時部署應用程式於多個伺服器也勝任有餘，總比手動部署來得有效率。

因此比起用Ansible來去試一試寫一個部署scripts，我想使用Ansible試一試一個簡單的例子去在各server 執行一些command (e.g df -h)，再把結果以電子郵件傳送，這樣也可以感受一下Ansible的威力，雖然個人比起編寫yaml (yaml 內或text template 可以使用 jinja2 template language，一個類似Django template engine的template engine)，個人更喜愛寫Ruby 或 PHP scripts 。

首先在/etc/ansible/ansible.cfg 設定 host_key_checking = False，這樣會令測試ansible時簡單一點，ansible.cfg 的範例如下所示:

[defaults]
host_key_checking = False
log_path=/path/to/log

之後建立一個ansible playbook e.g site.yml

- hosts: all:!local
  tasks:
  - name: ping all hosts
    ping:
    register: ping_result
    ignore_errors: yes

  - name: check disk space for all hosts
    command: df -h
    register: disk_result
    ignore_errors: yes

  - name: check high cpu usage process
    shell: ps -eo pcpu,user,args | sort -r -k1 | head -n5
    register: cpu_result
    ignore_errors: yes

  - name: run ifconfig
    shell: ifconfig
    register: ifconfig_result
    ignore_errors: yes

  - name: template email
    local_action: template src=./files/email_template.j2 dest='./tmp/{{ hostvars[inventory_hostname]["inventory_hostname"] }}.txt'

- hosts: local
  tasks:
  - name: create result email
    template: src=./files/email_summary_template.j2 dest=./tmp/email.txt
    delegate_to: localhost

  - name: send email result
    local_action: mail host='{{ email_host }}' port='{{ email_port }}' to='{{ email_to }}' username='{{ email_username }}' password='{{ email_password }}' subject='Report' body='{{ lookup("file", "./tmp/email.txt") }}' from='{{ email_from }}' charset='UTF-8' subtype='html'

以上的yaml script的流程好簡單，純粹用ping + shell module在不同的server 去執行不同的指令，之後用register 去把執行結果紀錄至指定的variable。因為萬一執行時出現錯誤，我們還是希望ansible playbook可繼續執行，因此設定ignore_errors = true即可。

下一步便是把各servers的執行結果變為一個template，因為這個執行結果在local machine的下一個tasks是需要的，所以使用了local_action

以下便用 email_template.j2 的原始碼:

{% if ping_result is defined %}
<h2>Ping Command Result</h2>
-----------------------------------<br/>
{{ ping_result | to_nice_yaml | replace("\n","
") }}
<br/>
{% endif %}

{% if disk_result is defined %}
<h2>Disk Command Result</h2>
-----------------------------------<br/>
{{ disk_result | to_nice_yaml | replace("\n","
") }}
<br/>
{% endif %}

{% if cpu_result is defined %}
<h2>Command result for ps -eo pcpu,user,args | sort -r -k1 | head -n5</h2>
-----------------------------------<br/>
{{ cpu_result | to_nice_yaml | replace("\n","
") }}
{% endif %}
<br/>

執行結果是一個python 的 dict，為了確保所有的內容都被列印出來，純粹用to_nice_yaml 列印出來即可。一下步便是把每一個inventory的執行結果整理至一個email template，然後寄出。email_summary_template.j2的內容如下所示:

{% for host in groups['all'] %}
{% if host != 'localhost' %}
<h1>Result for {{ hostvars[host]['inventory_hostname'] }}</h1>
<b>==================================================================</b><br/>
{{lookup("file", "./tmp/" + hostvars[host]["inventory_hostname"] + ".txt")}}
{% endif %}
{% endfor %}

請注意，send email result的這個tasks全部都使用了variable，避免直接寫死任何容易更改設定在 playboook內，這一個動作明顯不符合Ansible本身的哲學，variable可以放在group_vars/all :

---
email_host: <email_host>
email_port: <email_port>
email_to: <email_to>
email_username: <email_username>
email_password: <email_password>
email_from: <email_from>

ansible的建議資料夾結構請參考 http://docs.ansible.com/ansible/playbooks_best_practices.html#directory-layout

最後我們還是編寫hosts 檔案，以下是hosts的檔案範例，建議先設定ssh key來做認證，小心保管好private key + public key，避免把密碼寫在hosts file

[local]
localhost ansible_connection=local

[servers]
<example1.com> ansible_user=<example_user1> ansible_port=<example_port1> ansible_ssh_private_key_file=.ssh/id_rsa
<example1.com> ansible_user=<example_user2> ansible_port=<example_port2> ansible_ssh_private_key_file=.ssh/id_rsa

設定方法可參考 https://blog.longwin.com.tw/2005/12/ssh_keygen_no_passwd/

執行ansible playbook的方法相當簡單，如下所示:

ansible-playbook -i hosts site.yml

這樣我們便完成了一個好簡單的ansible playbook，這個playbook也有相當多的改進的地方，例如我們都把tasks 都放在site.yml，現在還好，沒有太多tasks。但沒有按roles去把不同的tasks放入去長遠都會有維護上的問題，site.yml愈簡單愈容易維護，另外一個可以改進的地方是lookup時的錯誤處理。

想知道這個project的檔案結構，可參考 https://github.com/nickshek/ansible_mail_example

Nick Shek1/26/17About 3 min

移除及暫停所有Docker container 指令

怕自己忘記了，放上這個blog。這個指令在開發Docker Image 時還是經常使用的。

docker stop $(docker ps -a -q)
docker rm $(docker ps -a -q)

Nick Shek1/12/17Less than 1 minute

思考在linux一次性重新命名多個file的問題

作為一個偏好使用Linux平台的Developer，或會經常遇到一次性命名多個File的問題。如果File數目不算多的話，還可以透過mv command 一一執行。但是如果遇上成千隻呢?那肯定要想一個較有效率的方法! 逐一人手命名檔案不合理呢!

說實話，如果我自已遇到這個問題不懂思考如何解決，我自已都過不了自己那一關!

現在假設我們要把檔案名稱含有"a_"的名字改為"abc_"

shek@shek-pc:~/folder$ ls -la
total 8
drwxrwxr-x   2 shek shek 4096 Oct  1 01:53 .
drwxr-xr-x 103 shek shek 4096 Oct  1 01:30 ..
-rw-rw-r--   1 shek shek    0 Oct  1 01:30 a_b.txt
-rw-rw-r--   1 shek shek    0 Oct  1 01:30 a_c.txt
-rw-rw-r--   1 shek shek    0 Oct  1 01:53 b.txt

一般來說命名多個檔案的linux command 會類似這樣:

for FILENAME in *; do mv $FILENAME Unix_$FILENAME; done

但我自已就想到用ls + awk + sed 解決這個問題，awk 和sed 非常實用，小弟真的要花點時間再深入看看awk 和 sed 有什麼其他功能...首先是要Filter我們想要的File名

shek@shek-pc:~/folder$ ls -la | grep a | awk '{print $9}'

a_b.txt
a_c.txt

之後便行for loop了，為了安全起見還是不直接執行，列印了想行的command再執行

shek@shek-pc:~/folder$ for i in $(ls -la | grep a | awk '{print $9}'); do echo mv $i $(echo $i|sed 's/a_/abc_/g') \&\&; done
mv a_b.txt abc_b.txt &&
mv a_c.txt abc_c.txt &&

之後執行以下command 便完成了!

mv a_b.txt abc_b.txt &&
mv a_c.txt abc_c.txt

shek@shek-pc:~/folder$ ls -la
total 8
drwxrwxr-x   2 shek shek 4096 Oct  1 02:02 .
drwxr-xr-x 103 shek shek 4096 Oct  1 01:30 ..
-rw-rw-r--   1 shek shek    0 Oct  1 01:30 abc_b.txt
-rw-rw-r--   1 shek shek    0 Oct  1 01:30 abc_c.txt
-rw-rw-r--   1 shek shek    0 Oct  1 01:53 b.txt

Nick Shek9/30/16About 2 min

執行Laravel PHPUnit 時出現"Maximum function nesting level of '100' reached, aborting!"

執行Laravel Project的PHPUnit 若出現

Maximum function nesting level of '100' reached, aborting!

而在其他電腦運行時又沒有問題，解決方法是相當容易。先在terminal執行

php --ini

確認php.ini 路徑，之後在php.ini加入

xdebug.max_nesting_level=300

即可。

Nick Shek7/10/16Less than 1 minute

docker build image 時出現 no space left on device

若發現明明電腦有好多空間，但是運行docker build時仍出現 no space left on device。則可以先運行docker info，若確認出現 Storage Driver: devicemapper��，則表示你的image 過了Base Device Size��。解決方法是找出docker.service，找出

ExecStart=/usr/bin/docker daemon -H fd://�������������������������������������������������������������������������

變為

ExecStart=/usr/bin/docker daemon --storage-opt dm.basesize=20G -H fd://�������������������������������������������������������������������������

之後請先參考自行備份https://linuxconfig.org/docker-container-backup-and-recovery原有的container

再執行

systemctl����������� daemon-reload
service docker stop
service docker start

之後新加的image 就會增加了base size!

Nick Shek7/9/16Less than 1 minute