1
2
3
4
5
6
7
8

<script setup>
import { defineProps, defineEmits } from 'vue';
const props = defineProps({
  foo: String
})

const emit = defineEmits(['change', 'delete'])
</script>

在 Vue3 編譯時出現這個警告
[@vue/compiler-sfc] defineProps is a compiler macro and no longer needs to be imported.
[@vue/compiler-sfc] defineEmits is a compiler macro and no longer needs to be imported.

Vite 是由 Vue 之父 尤雨溪開發的新打包工具，可以說是 Vue Cli 的升級版，Cli 因為有依賴 webpack 解決了很多打包上複雜的問題，然而，當專案越來越大，打包時間隨著專案變大包跑得越久，大大降低了開發者的開發效率和幸福感。

vite 解決了開發速度上的痛點，秒啟動根本驚為天人⚡️⚡️⚡️！打包速度極快，不用像 vue-cli 要進行編譯後啟動，省了很多開發上的時間。

填寫表單時，需要驗證是否必填(require)、或是格式是否正確，自己手刻很複雜，可能也會不夠全面，用套件來做驗證是最省事又快速的。在 Vue2 框架時，我偏好使用 vee-validate 來做驗證，因為它簡單又好用，但到了 Vue3，veeValidate4 怎麼好像是另一個世界惹😱，vee-validate4 該怎麼使用呢

你有沒有遇過，當你分享網站連結到 Facebook 時，出現了詭異的縮圖，甚至連縮圖、介紹都沒有，不寫個訊息的話，完全不會讓人想點進去，有人可能還會以為你被盜了😅

今天在更新網站時，github actions 在 npm install 時發生了錯誤

1
2
3
4

npm ERR! code 1
npm ERR! path /home/runner/work/portfolio/portfolio/node_modules/node-sass
// ...中間太多省略
Error: Process completed with exit code 1.

根據資訊推測是 node-sass 的問題，爬了一下文發現，

在網站上常常會使用到 icon 圖示做為點綴，而現今行動版普及化，響應式網站大多使用縮放都不會失真的 svg 向量圖檔，來獲得最佳的視覺體驗。網路有很多的插件內建 svg 圖示可以做為字型使用，例如 fontawesome 使用上就很方便快速，不過有時候想要自行定義圖示，或是只有用到少數的 icon，不想載入太大包檔案，這次要介紹的就是可以自行客製 icon 的 icoMoon

上次被後端問了關於 Header 的問題，發現我對這 HTTP 的知識薄弱，實在慚愧🥺，馬上上網科普一下，
好在找到了偷米騎巴哥大大分享的直播影片，以下是從影片內容裡整理的資料，筆記記錄一下

有時候我們在開發專案時，會遇到開發環境跟正式環境資料不一樣的狀況，比較常見的就是域名不同，
最近我遇到的需求是，上正式站時，某個連結網址要換成正式站網址，但開發環境要用測試連結，那我們可以怎麼做呢?
像這種時候，可以使用環境變量，簡單解決各個環境的問題。

最近在 clone 新專案時，下了 npm install，發現 package-lock.json 裡的套件版本被更新了，但又怕推上去會有版本上的問題😓
爬了一下文才知道，原來 npm install 會自動幫你更新套件😨 可是瑞凡~~~我沒有要更新啊!!
不過意外也發現了另一個好東西npm ci，可以解決這個問題。

Git 常用指令

Git 是否有安裝成功：git --version