网上有很多很棒的工具,让作为前端开发人员的我们生活的更加轻松。在这篇文章中,我将快速介绍一下我在开发工作中经常使用的11种工具。 Node.green用来查询当前 Node 版本是否某些功能。例如,对象展开符( Rest/Spread Properties) 可以看到在 const a = { foo: 1};console.log({...a, b: 2}); 当你遇到以上错误,那大多就是 在线地址: https://node.green/ CanIUse当你想要确定某个 Web API 的兼容性的时候,这个在线工具将轻松搞定。 假设我们想知道哪些浏览器及其版本将支持 Web Share API: 查看结果。浏览器和支持 在线地址: https:/// Minify为了减少应用程序代码的包大小,我们在发布到到生产环境的时候,需要使它们最小化。 最小化消除了空格,无效代码等。这能够使应用程序包大小的显着减小,从而节省浏览器上的加载时间。(虽然在当下,有 webpack uglifyJS 等插件,但是当我在开发非打包的简单应用的时候,这个是一个不错的选择。 ) 在线地址: https://www./ Bit.dev
这也是从头开始构建设计系统的不错选择(因为它本质上具有设计系统所需的一切)。
在线地址: https://bit.dev/ Unminify免费的在线工具,用于最小化(解压,反混淆)JavaScript,CSS和HTML代码,使其可读性强,美观 在线地址: https:/// Stackblitz这是每个人都喜欢的工具。Stackblitz使我们能够使用世界上最流行和使用最多的IDE,即web上的Visual Studio代码。 只需单击一下, 当你想从浏览器中尝试一段代码或任何当前JS框架中的功能时, 还有其他很棒的在线IDE,但是我相信 在线地址: https:/// JWT.io如果您使用JSON Web令牌(JWT)保护应用程序安全,或者使用JWT允许用户访问后端的受保护资源。 决定是否应访问路线或资源的一种方法是检查令牌的到期时间。 有时候我们想要解码JWT以查看其有效 这个在线工具使我们能够插入令牌以查看其有效 在线地址: https:/// BundlePhobia您是否曾经不确定过 该工具使我们能够加载package.json文件,并显示将从package.json安装的依赖项的大小,也可以查询单包的体积。 在线地址: https:/// Babel REPL
该工具是Babeljs团队在网上建立的Web应用,可以将 ES6 +代码转换为ES5。 本人总结的两个比较方便的使用方式
在线地址: https:///en/repl Prettier PlaygroundPrettier是一个自以为是的JS代码格式化程序。 它通过解析代码并使用JS最佳编码实践将其重新打印来实施一致的样式。 该工具已在我们的开发环境中广泛使用,但它也具有一个在线地址,你可以在其中美化您的代码。 在线地址: https:///playground postwoman
在线地址: https:/// 本文翻译自 https://blog./12-use... 但是不仅仅是单纯地翻译,替换了原文中一些我觉得不太实用的并加入一些自己的总结。 最后如果我的文章有帮助到你,希望你也能帮助我,欢迎关注我的微信公众号 |
|