首頁  >  文章  >  web前端  >  JavaScript 中的控制台樣式只有幾千位元組

JavaScript 中的控制台樣式只有幾千位元組

王林
王林原創
2024-07-18 18:34:31771瀏覽

Console Styling in JavaScript with a few kilobytes

我不了解,但我喜歡讓我的 JavaScript 專案中的控制台日誌看起來不錯。由於並非所有終端都支援表情符號,除了為控制台輸出著色之外,我還有什麼更好的方法呢?

嗯,您可以透過Google搜尋您想要的每種控制台樣式的 ANSI 轉義程式碼來實現這一點。或者可以從 W3Docs 等頁面記住其中的一些內容。但我喜歡讓我的日誌看起來不錯,我絕對不是一個可以記住很多東西的人,而且我喜歡有一種方法在任何地方都有效。

嗯,我通常只在 JS 中使用彩色日誌,所以不需要任何地方都能工作的東西。但至少在涉及 JavaScript 的地方都可以運作。

所以我決定編寫自己的腳本,以函數的形式包含我可能需要的所有可能的 ANSI 轉義碼。但後來我意識到在我的所有專案中一遍又一遍地複製相同的腳本會很煩人。因此,作為一個除了npm i 和init 之外從未使用過npm 命令的人,我決定了解更多信息並創建一個私有NPM 包,我可以將其安裝在我的專案中(或者克隆其GitHub 存儲庫以用於非NodeJS 專案)。
我不想每次安裝軟體包時都處理 NPM 身份驗證,所以我只是將其公開。

這就是我們今天要討論的內容:javascript-console-styling 是我為了簡化這個過程而製作的一個套件。

確實,以前也製作過和我類似的包(這是我製作後才意識到的事實)。但我注意到我自己的解決方案對我或像我這樣的人來說仍然更好:

  • 根據 npm 的數據,我的包包只佔了 14KB 的空間。而其他類似的包裝則佔用了相同數量的 50 倍(超過 500 KB)。儘管它們都在兆位元組以下,但最好使用較小的包,因為您可以輕鬆管理其所有文件(或者如果您願意,甚至可以輕鬆分叉並修改它)

  • 我的包可以嵌套不同的樣式和裝飾,因為它們是函數...即使您有一個完整的樣式字串,其中包含具有不同樣式的子字串,那麼您也可以連接子字串(包括內部的子字串)由於每個樣式函數都會重置,父字串將阻止在其之後應用任何樣式)

  • 我的包有簡單的測試工具,可以顯示所有可能的顏色和裝飾組合,以便用戶可以在終端中驗證其輸出(測試功能不包含在預設包中,但可以在NPM 頁面和GitHub)

所以總的來說,我更喜歡使用自己的程式碼。但擁有公共套餐的一部分是確保人們知道它可以如何幫助他們,以便他們可以在需要時自行選擇。

我不認為這會是我創建的最後一個 NPM 包,但這是一個讓我對整個 NPM 事情充滿動力的好方法!

請務必檢查包裝,祝駭客快樂!

以上是JavaScript 中的控制台樣式只有幾千位元組的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn