最近常在 vscode 寫 react，由於 react 是使用 jsx 語法，發現 emmet 在 js 檔案無法正常的自動產生 html 紀錄一下後來查到的解決方式 進入 vscode 的 Preference > User Settings 加入以下的設定 參考資料： https://github.com/Microsoft/vscode/issues/4962
[mac] 查詢正在使用的 port 及 process id
查詢目前使用中的 port 及 process id lsof -n -i | grep LISTEN 查詢特定 port 的服務，以 80 port 為例 lsof -n -i:80 | grep LISTEN 參考資料： https://stackoverflow.com/questions/4421633/who-is-listening-on-a-given-tcp-port-on-mac-os-x
[mysql] InnoDB: Table `mysql`.`innodb_table_stats` not found.
前陣子裝了 mysql，但似乎沒裝完整，導致執行 mysql 機器負載總是衝很高。 看了一下 mysql error.log InnoDB: Table `mysql`.`innodb_table_stats` not found. Table ‘performance_schema.session_variables’ doesn’t exist 嗯…連 show variables; 都無法執行 查了一下相關資料，用以下步驟即可解決。 強制更新 mysql mysql_upgrade -u root -p –force 重開 mysql sudo service mysql restart 參考資料： https://stackoverflow.com/questions/31967527/table-performance-schema-session-variables-doesnt-exist
[nginx] 錯誤，client intended to send too large body
之前因為把機器上原本的 apache 的 web server 換成 nginx，遇到了這個錯誤 client intended to send too large body 查了一下資料發現造成的原因為 web server 接收 request body 的大小設定 apache: LimitRequestBody 預設為 0(unlimit) nginx: client_max_body_size 預設為 1m 根據以下步驟更改一下 nginx 設定，就沒問題了 vim /etc/nginx/nginx.conf sudo sercie nginx reload 參考資料： https://craftcms.stackexchange.com/questions/2328/413-request-entity-too-large-error-with-uploading-a-file
[vscode] experimental support for decorators is a feature that is subject to change in a future release
在 visual studio code 使用 ES7 (ECMA Sciprt7) 的 decorator 時，可能會遇到 experimental support for decorators is a feature that is subject to change in a future release的語法錯誤提示 至於 decorator 是什麼在這篇就不多加介紹(可參考這篇)，不過寫過 python 的人應該會有使用過。(目前 ES7 的 decorator 只支援 class) 這是因為預設 vscode 並不支援 decorator 的語法檢查，需要手動打開支援 decorator 的語法功能。 在 project 目錄創建 tsconfig.json 新增以下內容 重新開啟 vscode，就不會出現語法錯誤提示了! 參考資料： https://ihatetomatoes.net/how-to-remove-experimentaldecorators-warning-in-vscode/
[nginx] 移除不必要的預設 header，”Server” 版本
預設安裝好 nginx 會有 web server 版本資訊的 header 如下圖 為了資訊安全上面的考量，建議將 /etc/nginx/nginx.conf 的 server_tokens off; 打開 這樣就不會在 header 顯示 nginx 的版本資訊。 如果你想進一步將此 header 完全移除掉的話，可以考慮裝 nginx 的更改 header module 這樣就可以設定 more_clear_headers Server; 移除此 header。 參考資料： https://serverfault.com/questions/214242/can-i-hide-all-server-os-info https://geekflare.com/wp-content/uploads/2016/05/nginx-default-header.png
[centOS] 安裝 phantomjs 錯誤，phantomjs: error while loading shared libraries: libfreetype.so.6: cannot open shared object file: No such file or directory
在 centOS 上面安裝 phantomjs 遇到了以下的錯誤 phantomjs: error while loading shared libraries: libfreetype.so.6: cannot open shared object file: No such file or directory 這是因為缺少 phantomjs 的相依套件 解決方法: 參考資料： http://sameerhalai.com/blog/how-to-install-phantomjs-on-a-centos-server/
[javascript] 取網址 get 的 值(key-value)，get query key/value
紀錄一下 vanilla.js 取網址 get key-value 的方法 參考資料： https://stackoverflow.com/questions/9870512/how-to-obtaining-the-querystring-from-the-current-url-with-javascript
[Nodejs] module.exports 與 exports 的差別
如果沒有接觸過 commonJs 這類可以將 js 模組化為檔案的開發者，剛開始寫 Nodejs 時可能會有點不懂 module.exports 與 exports 的差別 舉例來說： 有一個 player.js 這樣就產生了一個 player.js 這個模組 如果今天 main.js 想要使用這個模組，就可以透過 require 來引入模組 如： 再來我們看看使用 exports 新增一個 removePlayer 的方法 原因是在模組裡面其實會預先幫你做 預設當我們使用 exports 其實也代表更改了 module.exports 。 但當直接使用 module.exports = {…} 其實也就更改了模組對外公開的物件，因此更改 exports 時無法更改到 module.exports。 參考資料： https://program365.wordpress.com/2015/07/02/understanding-module-exports-and-exports-in-node-js/
[test] Nightwatch.js debug 血淚史
前情提要: 本篇使用 [email protected] ((3.5.0以上會有不同的問題… 使用 Nightwatch.js 寫前端的 E2E test一段時間了…踩了不少雷 Nightwatch 底下還是使用 selenium 與 支援各瀏覽器的 webdriver ，其實大多狀況都是發生在各 web driver 跟 selenium….啊(嘆~ 來記錄一下使用 Nightwatch.js 遇到的幾個問題~ selenium： Error retrieving a new session from the selenium server Connection refused! Is selenium server started? …. 最常出現以上這個訊息，可以先試著單獨開啟 selenium 在預設 port 4444，透過瀏覽器手動創建 session 確認 selenium 有正常運作。 java -jar selenium-server-standalone-{VERSION}.jar 另外，如果要透過 nightwatch.js 自動開啟 selenium，記得要將 nightwatch.json 設定檔中的 selectium start_process 設為 […]