前端开发必备之chrome插件
Posted 前端布道
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端开发必备之chrome插件相关的知识,希望对你有一定的参考价值。
Chrome浏览器目前是网络上可用的最好的浏览器之一,并且自2011年11月超越了Firefox浏览器之后,已经成为了互联网上占主导地位的浏览器。
本篇文章将与大家分享一些与前端开发有关的实用的Chrome浏览器插件,这些插件可以帮助你提高前端开发工作效率。
Allow-Control-Allow-Origin: *
允许应用从不同的来源请求数据,特别适用于前后端分离的开发模式,解决开发中的浏览器跨域问题。
Code Cola
可视化编辑在线页面css样式并实时查看效果,而且可以保存编辑好的css样式。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/13e5314967df4af8b310ea9638cb8010.jpg)
Image Downloader
浏览当前页面所有的图片并可以快速下载图片。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/d01883b73db549c9ae668a0b9f0b64de.jpg)
javascript Errors Notifier
将当前页面所有的 JavaScript 错误提示出来。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/ecead6fe080a4487a1b3592d9166a3a5.jpg)
JSON-handle
查看、编辑、格式化JSON,也可以根据数据中的图片url查看图片。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/fce578cb51d54da482caa8dccfca3b4b.jpg)
Library Sniffer
探测当前网页所使用的类库、框架和服务器环境。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/5290e03b040440e7a7f1fa2f05952858.jpg)
Lighthouse
帮助你分析页面的性能并提出可优化的地方。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/f31049fb1e324b7cab9a7de2f4bd887c.jpg)
Page Ruler
绘制一个标尺来获取像素尺寸和定位,并在任何网页上测量元素。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/b2721245cb46404093f8ca652059108c.jpg)
Pesticide
高亮显示页面每个元素的位置。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/f51e5d416d1541a7b67e762d5aa5321f.jpg)
Simple Material Design Palette
好用的css调色板。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/738dcd7c0f964532be3122571a8341e7.jpg)
User-Agent Switcher
默认不同的浏览器用户代理信息,方便多浏览器调试。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/c8b1acebf71941b6acb93f346ee3ac89.jpg)
Web Developer Checklist
使用最佳实践来分析页面。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/ead76cad448642d3b637971288a5ed4e.jpg)
WEB前端助手(FeHelper)
包括JSON格式化、二维码生成与解码、信息编解码、代码压缩、美化、页面取色、正则表达式、时间转换工具、编码规范检测、页面性能检测、Ajax接口调试。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/52b026b3579540699bf6d9b2e876a984.jpg)
WhatFont
识别元素使用的字体。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/f8ddbe7f5f6a4afc9d2471f49235e4d7.jpg)
Window Resizer
调整浏览器窗口,模拟各种屏幕分辨率。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/792340bf9c2b4af5ae5f1b9a64827d05.jpg)
Take Webpage Screenshots Entirely - FireShot
捕捉网页截图,编辑并将它们保存为PDF,JPEG,GIF,PNG或BMP;上传,打印,在Photoshop中打开,复制到剪贴板或电子邮件
![前端开发必备之chrome插件](https://image.cha138.com/20210408/9f02139ea62e4d618e377f462f29b959.jpg)
Postman
模拟各种类型的请求,更快地构建、测试并记录API。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/fc7c72f661b7427d8961c9adbb2364e4.jpg)
Augury
调试和分析Angular应用程序。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/6e527e669a134d5fa459e3c3d914be09.jpg)
Vue.js devtools
调试和分析Vue应用程序。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/687aa05171f6442bbd47c6ee69a997ec.jpg)
React Developer Tools
调试和分析React应用程序。
![前端开发必备之chrome插件](https://image.cha138.com/20210408/fcf9b819c4414a4e96b3299110b60c8c.jpg)
以上是关于前端开发必备之chrome插件的主要内容,如果未能解决你的问题,请参考以下文章