watch

本文將解釋如何在文件夾的文件變更時重新運行 package.json 腳本。 我的實際問題是：我希望在文件變更時自動重新生成 CSS，通過 PostCSS 流程進行處理。 我描述的方法將適用於任何類型的自動文件和文件夾監視，而不僅僅是這個特定情況。 我正在運行以下腳本，使用 yarn build:css 命令運行： "scripts": { "build:css": "postcss src/tailwind.css -o static/dist/tailwind.css", } 我希望在 layouts 文件夾中的任何變更發生時重新運行它，該文件夾包含構建我的網站的所有 HTML 文件。 如果您熟悉 Tailwind，它會創建一個稍大的 CSS 文件，其中包含您可能需要的所有內容，並且您可以通過刪除您不使用的任何類來進行優化。 每次我在其中進行更改時，我都希望重新生成 CSS，並觸發我在 PostCSS 設置中設置的清理和最小化過程。 如何實現這一點呢？ 首先，安裝 watch npm 套件： npm install watch 然後在您的 package.json 文件中加入 watch 腳本。您已經有了之前的 build:css，我們只需添加一個監視 layouts 文件夾並在每次變更時運行 build:css 的腳本： "scripts": { "build:css": "postcss src/tailwind.css -o static/dist/tailwind.css", "watch": "watch 'npm run build:css' ./layouts" } 現在運行 npm run watch 或 yarn watch。

一個關於如何使用調試來解決任何 JavaScript 問題的教程 調試是一個很好的技能，它可以幫助你解決 JavaScript 代碼中的每個問題。 每天早上我們起床，吃美味的早餐，坐在電腦前寫完美的代碼，這個夢想是理想的，不是嗎？但這只是一個夢想而已。 無論你有多好，無法寫出沒有缺陷的代碼。代碼總是有缺陷的，這是它的定義。 當你開始寫代碼時，你可能沒有見過或預料到錯誤。錯誤可能只有在你將程序發佈給用戶之後才會被發現，這是最糟糕的情況。 錯誤可能由你自己在測試程序時發現，甚至可能在某些事情正常運作時就突然出現故障，只因為你改變了一行代碼。 這些被稱為回歸錯誤。 作為開發人員，錯誤是我們日常工作的一部分，但我們的工作是盡可能地將它們減少到最低。 當你知道有錯誤時，你如何解決它呢？ 嗯，最難的部分始終是確定錯誤發生在哪裡。 然後，第二個最困難的部分是找出為什麼會發生這個錯誤。 一旦你知道了上述所有問題的答案，解決錯誤通常就很容易了。 通常我們可以做兩件事來解決錯誤。 一種技術是非常基本的，涉及嘗試找出狀態（變量的內容）和程序流程的值，並將這些變量打印到日誌或程序的輸出中。 找出錯誤可能出現的地方 調試是一種對程序員活動非常核心的技能。 有時候我們盡力工作，但程序卻不能正常工作，例如，它崩潰了，只是運行得很慢，或者它打印了錯誤信息。 當你寫的程序不像你預期的那樣運行時，你會怎麼做？ 你開始調試它。 第一步始終是觀察發生了什麼，並嘗試確定問題來自哪裡。 它是環境中的問題嗎？ 它是你給程序的輸入中的問題嗎？ 它是由於內存使用過多而導致的一次性崩潰嗎？ 還是每次運行它都會發生？ 這些都是在解決問題時開始朝著正確方向前進的重要信息。 一旦你對錯誤的來源有了一些想法，你就可以開始檢查該特定程式碼的部分了。 最簡單的調試方式，至少在工具方面而言，是讀出你所寫的代碼。大聲讀出來。 如果你讀的是一個字符串或一個數字，那麼聽起來沒有任何魔力。 然而，有時我們可以通過這種方式發現問題。 在這一步之後，就是使用一些工具的時候了。 你第一次接觸 alert() 和 console.log() 如果閱讀代碼對你來說毫無意義，那麼下一個合乎邏輯的步驟就是開始在代碼中添加幾行代碼，以幫助你找到問題所在。 在 JavaScript 前端代碼中，你通常會使用 alert() 和 console.log()。 考慮以下代碼行： const a = calculateA() const b = calculateB() const result = a + b 出於某種原因，我們不知道代碼的最終結果計算不正確，所以我們在計算結果之前添加 alert(a) 和 alert(b)。 當瀏覽器執行代碼時，它會打開兩個警告對話框： const a = calculateA() const b = calculateB() alert(a) alert(b) const result = a + b 如果你將 alert() 傳遞的是一個字符串或一個數字，這種方法是行得通的。...