JavaScript 中的控制台样式只有几千字节
发布于2024-08-01
浏览：750
我不知道你，但我喜欢让我的 JavaScript 项目中的控制台日志看起来不错。由于并非所有终端都支持表情符号，除了为控制台输出着色之外，我还有什么更好的方法呢？
嗯，您可以通过谷歌搜索您想要的每种控制台样式的 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 事情充满动力的好方法！
请务必检查包装，祝您黑客愉快！
版本声明
本文转载于：https://dev.to/proman4713/console-styling-in-javascript-with-a-few-kilobytes-2gjn?1如有侵犯，请联系[email protected]删除
最新教程
更多>
-
如何修复 Matplotlib 中的“无显示名称且无 $DISPLAY 环境变量”错误？"_tkinter.TclError: no display name and no $DISPLAY 环境变量"使用 Matplotlib 运行 Python 脚本时通常会发生此错误在没有图形显示的服务器上。 Matplotlib 依赖后端来渲染绘图，默认情况下，它选择 Xwi...编程 发布于2024-11-05 -
您的第一个使用 Node.js 的后端应用程序您是否正在学习 Web 开发并对如何启动 Node.js 项目感到困惑？别担心，我有你！我将指导您只需 5 个步骤即可使用 Node.js 和 Express.js 创建您的第一个后端。 ️5个关键步骤： 第 1 步：设置项目 第 2 步：整理文件夹 第3步：创建server.js文...编程 发布于2024-11-05
-
跨域场景下CORS何时使用预检请求？CORS：了解跨域请求的“预检”请求跨域资源共享 (CORS) 在制作 HTTP 时提出了挑战跨域请求。为了解决这些限制，引入了预检请求作为解决方法。预检请求说明预检请求是先于实际请求（例如 GET 或 POST）的 OPTIONS 请求）并用于与服务器协商请求的权限。这些请求包括两个附加标头：Ac...编程 发布于2024-11-05
-
如何使用 PHP 的 glob() 函数按扩展名过滤文件？在 PHP 中按扩展名过滤文件使用目录时，通常需要根据扩展名检索特定文件。 PHP 提供了一种使用 glob() 函数来完成此任务的有效方法。要按扩展名过滤文件，请使用语法：$files = glob('/path/to/directory/*.extension');例如，要检索目录 /path/...编程 发布于2024-11-05
-
理解 JavaScript 中的 Promise 和 Promise Chaining什么是承诺？ JavaScript 中的 Promise 就像你对未来做某事的“承诺”。它是一个对象，表示异步任务的最终完成（或失败）及其结果值。简而言之，Promise 充当尚不可用但将来可用的值的占位符。 承诺国家 Promise 可以存在于以下三种状态之一： ...编程 发布于2024-11-05
-
Pip 的可编辑模式何时对本地 Python 包开发有用？使用 Pip 在 Python 中利用可编辑模式进行本地包开发在 Python 的包管理生态系统中，Pip 拥有“-e”（或'--editable') 特定场景的选项。什么时候使用这个选项比较有利？答案在于可编辑模式的实现，官方文档中有详细说明：“从本地以可编辑模式安装项目（即 se...编程 发布于2024-11-05
-
当您在浏览器中输入 URL 时会发生什么？您是否想知道当您在浏览器中输入 URL 并按 Enter 键时幕后会发生什么？该过程比您想象的更加复杂，涉及多个步骤，这些步骤无缝地协同工作以提供您请求的网页。在本文中，我们将探讨从输入 URL 到查看完全加载的网页的整个过程，阐明使这一切成为可能的技术和协议。 第 1 步：输入 U...编程 发布于2024-11-05
-
如何有效管理大量小HashMap对象的“OutOfMemoryError：超出GC开销限制”？OutOfMemoryError: Handling Garbage Collection Overhead在Java中，当过多时会出现“java.lang.OutOfMemoryError: GC Overhead limit allowed”错误根据 Sun 的文档，时间花费在垃圾收集上。要解决...编程 发布于2024-11-05
-
为什么在 Python 列表初始化中使用 [[]] * n 时列表会链接在一起？使用 [[]] * n 进行列表初始化时的列表链接问题使用 [[]] 初始化列表列表时 n，程序员经常会遇到一个意想不到的问题，即列表似乎链接在一起。出现这种情况是因为 [x]n 语法创建对同一基础列表对象的多个引用，而不是创建不同的列表实例。为了说明该问题，请考虑以下代码：x = [[]] * ...编程 发布于2024-11-05
-
Python 变得简单：从初学者到高级 |博客Python Course Code Examples This is a Documentation of the python code i used and created , for learning python. Its easy to understand and L...编程 发布于2024-11-05
-
简化 TypeScript 中的类型缩小和防护Introduction to Narrowing Concept Typescript documentation explains this topic really well. I am not going to copy and paste the same descrip...编程 发布于2024-11-05
-
何时应该使用 session_unset() 而不是 session_destroy() ，反之亦然？理解 PHP 中 session_unset() 和 session_destroy() 的区别PHP 函数 session_unset() 和 session_destroy() 有不同的用途管理会话数据。尽管它们在清除会话变量方面有明显相似之处，但它们具有不同的效果。session_unset(...编程 发布于2024-11-05
-
如何选择在 C++ 中解析 INI 文件的最佳方法？在 C 中解析 INI 文件：各种方法指南在 C 中处理初始化 (INI) 文件时，开发人员经常遇到有效解析这些文件以提取所需信息的挑战。本文探讨了用 C 解析 INI 文件的不同方法，讨论了它们的优点和注意事项。本机 Windows API 函数一种方法是利用 Windows API 函数INI ...编程 发布于2024-11-05
![为什么在 Python 列表初始化中使用 [[]] * n 时列表会链接在一起？](http://www.luping.net/uploads/20241021/17294774536715bb4d76111.jpg)
学习中文
- 1 走路用中文怎么说？走路中文发音，走路中文学习
- 2 坐飞机用中文怎么说？坐飞机中文发音，坐飞机中文学习
- 3 坐火车用中文怎么说？坐火车中文发音，坐火车中文学习
- 4 坐车用中文怎么说？坐车中文发音，坐车中文学习
- 5 开车用中文怎么说？开车中文发音，开车中文学习
- 6 游泳用中文怎么说？游泳中文发音，游泳中文学习
- 7 骑自行车用中文怎么说？骑自行车中文发音，骑自行车中文学习
- 8 你好用中文怎么说？你好中文发音，你好中文学习
- 9 谢谢用中文怎么说？谢谢中文发音，谢谢中文学习
- 10 How to say goodbye in Chinese? 再见Chinese pronunciation, 再见Chinese learning
