使用 WebStorm 開發 Hugo (Modern CSS)
WebStorm 目前並沒有原生支援 Hugo,須另外安裝 Smart Hugo plugin,且不再使用 Prettier 與 Stylelint,直接使用 WebStorm 內建功能,打造 Zero Dependency 與 No Node.js 開發環境。
WebStorm 目前並沒有原生支援 Hugo,須另外安裝 Smart Hugo plugin,且不再使用 Prettier 與 Stylelint,直接使用 WebStorm 內建功能,打造 Zero Dependency 與 No Node.js 開發環境。
本文記錄我的 WebStorm 基本設定。
Vim 優點在其高效的 鍵盤 控制,可完全不需 滑鼠 或 觸控板 介入。JetBrains 亦官方提供 IdeaVim Plugin,讓我們在 WebStorm 也能使用 Vim 模式。
WebStorm 目前並沒有原生支援 Hugo,必須另外安裝 Smart Hugo plugin,但原生支援 Prettier 美化 HTML/SCSS/JavaScript,與 Stylelint 加強 CSS 檢查與排序。
WebStorm 已經提供 Vue Plugin 完整支援 Vue,唯一只有 .vue 格式縮排部分,Webstorm 與 Vue 的看法迥異,在 Reformat Code 之後,縮排會完全跑掉,需要稍微調整。
在 .scss 使用新的 @use 引用其他檔案時,WebStorm 會報錯找不到檔案。
實務上很多目錄與檔案是由工具所建立與使用,我們並不會參與編輯,可將這些在專案中隱藏。
WebStorm 目前還沒有支援 Alpine,但可按裝 3rd Party 的 Alpine.js Support Plugin 支援 Alpine。
Hugo 的 Layout 是使用 Go Template,我們可安裝 JetBrains 官方的 Go Template Plugin 使其語法變色。
Since Chrome is bad, we often use Brave to replace Chrome for development. We can still use Brave to preview on WebStorm.