分類: Vue

Vue SFC AI 開發

用 <spec lang="md"> 標籤在 Vue 中舒服的使用 SFC 搭配 AI 開發

許多開發者都會搭配著 AI 工具（Claude Code、Gemini、Copilot 等）來協助撰寫程式碼，而在 Vue 的單檔元件（Single File Component, SFC）中，常常會遇到一些困擾，所以這邊就來分享一個不同的做法，也就是自訂一個 &lt;spec lang="md"&gt; 標籤，來讓我們能夠在 SFC 中更舒服地使用 AI 工具來開發。

2025-11-06 6 分鐘閱讀

閱讀全文

Composition API ref Vue 3

不同於 ref 的 shallowRef 宣告

如果你是一名 Vue 開發者，相信你一定格外熟悉 ref 這個響應式 API，但是你知道嗎？其實除了 ref 之外，你還可以用另一種 API 來宣告響應式變數，那就是 shallowRef，而 shallowRef 與 ref 有什麼不同呢？就讓我們來認識一下吧！

2025-02-16 6 分鐘閱讀

閱讀全文

Vue Composition API ref

來聊聊 Vue3 Composition API 變數宣告的另一種設計

最近在跟朋友聊 Vue Composition API 的時候，順便翻了一下官方文件，剛好看到一個區塊滿有趣的就順便寫一篇文章來記錄哩。

2024-03-13 8 分鐘閱讀

閱讀全文

Vue Composition API ref

遲早你會面對的問題，Vue3 Composition API 的 ref 與 reactive 差異是什麼？

在 Vue 3 的 Composition API 中，我們可以透過 ref 與 reactive 來建立一個響應式的資料，但是這兩者差異在哪裡呢？所以我就寫了這一篇文章來簡單探討一下這兩者的差異在哪邊。

2024-01-06 7 分鐘閱讀

閱讀全文

Vue XSS DOMPurify

Vue3 中使用 DOMPurify 避免 XSS 攻擊

在 Vue 中，我們可以使用 v-html 來將 HTML 字串轉換成 DOM 元素，但是這樣會有一個問題，就是容易受到 XSS 攻擊，因為我們無法確保使用者輸入的內容是否安全，所以我們需要對使用者輸入的內容進行過濾，避免惡意的腳本被執行。

2023-12-05 5 分鐘閱讀

閱讀全文

JavaScript Vue HOF

關於在 Vue 的 Single-File Components 上使用 HOF 分析

最近朋友私訊問了我一個 Vue 有趣的地方，是關於它嘗試在 Vue 的 Single-File Components 上使用 Higher-Order Function（HOF）結果卻發生一個很有趣的雷點，所以就來寫一篇文章來分析一下這個問題。

2023-07-11 8 分鐘閱讀

閱讀全文

障礙排除 Vue Vue3

解決 Vue 專案上開發出現 Virtual script not found 的錯誤

最近改用新版的 Volar 之後打開一個新專案卻出現「Virtual script not found, may missing script lang="ts" / "allowJs": true / jsconfig.json.volar」的錯誤，所以這一篇記錄一下問題跟解決方式。

2023-04-19 2 分鐘閱讀

閱讀全文

Vue Composition API Vue 3

關於 Vue Props 單向資料流這件事

這一篇文章算是稍微記錄一下 Vue 關於 Props 單向資料流的有趣狀況以及該如何解決。

2023-04-16 7 分鐘閱讀

閱讀全文

Vite Vue Vue Cli

Vue 的圖片引入方式

這邊稍微記錄一下該如何正確地在 Vue Cli 或 Vite 中引入圖片，因為這個問題其實很常見也很容易搞錯，所以就乾脆寫一篇記錄一下。

2023-03-30 6 分鐘閱讀

閱讀全文

Vue Composition API VeeValidate

Vue3 VeeValidate v4.x 進階 - 客製化錯誤訊息

這一篇算是延續了前一篇「Vue3 VeeValidate v4.x 引入教學」的文章，算是介紹該如何客製化 VeeValidate 的錯誤訊息，因為有時候我們實戰開發上是需要客製 VeeValidate 的錯誤訊息的，所以這一篇就來記錄一下。

2023-03-06 3 分鐘閱讀

閱讀全文