Skip to content

alanlu-dev/web-kit

Repository files navigation

@alanlu-dev/web-kit

Build Status License

環境建置

在專案中,選擇適合的工具能夠提高代碼品質、開發效率以及團隊合作。以下是一系列可供選擇的工具,您可以根據專案需求和個人偏好進行選擇和配置。

開發工具

  • Visual Studio Code: 由微軟開發的跨平台代碼編輯器,擁有豐富的擴展生態系統和強大的功能。

包管理工具

  • pnpm: 一個快速、節省空間的包管理器,類似於 npm 和 Yarn,但共享依賴以節省空間。
  • fnm: 快速切換 Node.js 版本的工具,可幫助您在不同的項目中使用不同的 Node.js 版本。

代碼風格和格式化

  • EditorConfig: 跨編輯器和 IDE 的一致性代碼編寫風格工具。
  • Prettier: 自動美化代碼,確保代碼風格的一致性和可讀性。
  • ESLint: JavaScript 和 TypeScript 的靜態代碼分析工具,用於檢查代碼中的錯誤和實施一致的代碼風格。
  • Stylelint: CSS 和 SCSS/Less 的靜態代碼分析工具,用於檢查樣式表中的錯誤和一致性。
  • Markdownlint: Markdown 文件的風格和語法的工具。
  • husky: Git 鉤子工具,用於在 Git 操作觸發前執行指定的代碼。
  • lint-staged: 在 Git 暫存區上運行 lint 工具的工具,通常與 husky 一起使用。
  • commitlint: 檢查提交消息是否符合指定格式的工具,通常與 Conventional Commits 一起使用。
  • CSpell: 拼寫檢查工具,用於檢查代碼和文本文件中的拼寫錯誤。

版本控制

  • Conventional Commits: 一種標準化的提交消息格式,用於生成一致的提交消息,以便自動化版本控制和發布。
  • czg: 用於生成符合 Conventional Commits 的提交消息的交互式命令行工具。
  • changeset: 一個用於管理 monorepo 中發布版本的工具。Changeset 允許您將多個包的變更集中管理,並生成一致的發布版本,以確保版本管理的一致性和可追溯性。

建構工具

  • Vite: 現代化的前端開發工具和建構工具,提供快速的開發體驗和優化的生產環境。
  • unbuild: 構建和打包 JavaScript 和 TypeScript 項目的工具,提供零配置的構建和打包功能。
  • Turborepo: 管理多個 monorepo 專案的開發者工具,提供統一的開發體驗和依賴管理。

測試工具

  • Vitest: Vite 的測試工具,專注於提供簡單且快速的測試環境,基於 Jest 框架。

JavaScript

  • TypeScript: 靜態類型的 JavaScript 語言,提供更強大的開發工具和代碼檢查。

Style

  • SCSS: CSS 預處理器,添加了變量、嵌套、Mixin 等功能以提高代碼可重用性和維護性。
  • PostCSS: 轉換 CSS 的工具,可以自動添加瀏覽器前綴、優化代碼等。
  • Master CSS: CSS 語言和框架,用於快速構建現代和高性能的網站。