打造前端MAC工作站（八）配置称手的 chrome 和 safari 浏览器

前言

前端工程师绝大部分的工作成果都是需要在浏览器中查看的。当然，浏览器更是我们学习和娱乐的重要窗口，因此，选择和配置一款好用的浏览器，那是必须的。

如果不是考虑在移动办公省电的原因，我想大家都会选择 chrome 浏览器作为主力浏览器。不过它比较费电，建议在插上电源的时候使用。如果移动办公，建议使用 safari 浏览器，比较省电。

除此之外，当然还有 firefox 火狐浏览器，有很多人喜欢用它的控制台的。 opera 浏览器自动换了 webkit 核心，基本就和 chrome 浏览器一致了。除非是情怀，否则我个人认为没必要安装这款浏览器。

如果是 windows 重度用户，可能更喜欢国产浏览器。在MAC上国产浏览器相对较少，不过腾讯QQ浏览器有MAC版本。如果你喜欢国产浏览器，可以使用它。相对来说，还是比较人性化的。

安装和配置 chrome 浏览器

首先，去官方网站下载浏览器进行安装。

网址：https://www.google/chrome/browser/desktop/index.html

不过需要注意的是，需要科学上网才能访问谷歌网站。如何科学上网我只能给一个提示 ShadowsocksX 。更多内容请使用 bing 搜索引擎搜索，这里使用百度是无解滴！

安装浏览器后，我们需要简单的进行一些配置和插件的安装。

首先，建议你在浏览器中登录你的谷歌账户，登录账户后，可以在不同的电脑之间同步你的插件，收藏夹，以及其他内容，跨电脑工作不再是问题

让 chrome 支持显示小于 12px 的汉字

⌘ + , 是技术所有软件的设置面板的快捷按键。MAC一个很大的优势就是快捷键的统一。

按 ⌘ + , 打开浏览器设置页面，滚动到设置页面最下方，点击显示高级设置…，就可以出现更多的设置选项了。

在这里，我们找到网络内容 → 字号，点击后面的 自定义字体，将会弹出下面的对话框

在对话框中，我们把最下面的最小字号拉倒最左面，点击完成，即完成了我们的配置。

安装一些插件

首先，我们按 ⌘ + , 打开设置页面，点击右上方的扩展程序，如果你有安装插件的话，那么这里将会显示你的插件列表。如果没有安装的话，我们点击获取更多扩展程序打开谷歌的chrome扩展程序商城。

然后就可以在里面搜索和安装各种插件或者皮肤了。我推荐安装下面的几款插件

vimium

让浏览器操作脱离鼠标的牛逼插件，提高效率必备，黑客必备，装逼必备。

安装好插件后，在任意网页，按下 f 键，即可出现如上图的黄色背景的字母，按顺序录入字母，即可打开对应的链接。非常的高效。

当然，这款vimium的功能可不仅仅是这么一个。你在任意页面可以按 shift + ? 打开帮助页面，

最常用的分别是 d,u,f这三个，更多内容自己研究。

Adblock Plus

屏蔽绝大多数网站的绝大多数广告必备插件。

小黄瓜视频广告拦截

可以屏蔽优酷，iqiyi，等主流视频网站的广告，虽然MAC客户端中全是免广告的，但不排除我们使用浏览器访问视频网站，所以这个插件也是颇有用处的。

The QR Code Extension

将当前网址生成二维码，便于我们在制作页面的过程中用手机来测试页面，直接扫码即可，推荐安装。

划词翻译

翻译插件，英文不好者，必备。

Vue.js devtools

VUE开发必备插件。继承与控制台中，方便好用。

chrome 插件万万千千，选择太多那就有选择恐惧症了。建议大家在不断的配置中找到自己所需要的那几款钟情的插件。

用 chrome 调试安卓手机页面

将你的安卓手机打开开发者调试模式，然后用数据线连接MAC的USB接口。

打开谷歌浏览器，在地址栏输入chrome://inspect/，即可看到你的安卓手机了。

在手机上用浏览器打开任何页面，其控制台均可在 chrome 浏览器中调试。

测试移动端必须掌握的 chrome 技能。

配置 safari 浏览器

safari 是一款极佳的浏览器。可惜 windows 上的版本太挫了。不过在MAC上，其实它是非常棒的。如果不是习惯使然，用 safari 作为主力浏览器也并无不可。

开启开发者模式

按⌘ + , 打开设置面板，切换到高级选项卡，勾选在菜单中显示“开发”菜单，然后在最上面的菜单栏里面就有了开发菜单

在开发下面，我们可以完成很多的操作。

用 safari 调试 iphone 手机页面

手上没有iphone的数据线，暂时先不放图了。把iphone插上数据线，连接上MAC，就可以在safari的开发中找到iphone手机，手机上用safari打开网页，便可在MAC上进行各种调试了。

安装 vimme 插件

类似于 chrome 下面的 vimium 插件，不过没有它好用。聊胜于无。

其它的插件我都没有安装。不过你依然可以在 https://safari-extensions.apple 页面寻找你喜欢的插件。

我个人建议是，如果不作为主力浏览器，就没必要折腾了。

小结

本文主要讲了chrome和safari浏览器的简单配置，其他浏览器大概其差不多也是这个意思。

顺手的浏览器可以让我们的工作效率更高。另外，mac下面是没有IE浏览器的。因此，如果你没有windows的电脑，测试IE就必须使用虚拟机了。

本文由FungLeo原创，允许转载，但转载必须附注首发链接。谢谢。