chrome插件网页抓取(调试vue.应用的浏览器扩展ChromeVue.js的开发者扩展)

　　chrome插件网页抓取(调试vue.应用的浏览器扩展ChromeVue.js的开发者扩展)

　　如果要在chrome中安装插件，首先必须要有chrome应用商店，但默认是没有应用商店的；

　　

　　默认情况下，下面的界面是空白的，没有任何东西，第一步是安装【谷歌访问助手】

　　

　　安装步骤

　　第一步：

　　下载【下载谷歌Access助手插件压缩包】，我的是Mac版，可以从网上下载一个Windows版

　　这是mac版Google Access Assistant压缩包链接

　　链接：密码​​：f3r7

　　这是windows压缩包的链接

　　链接：提取码：gbir

　　第2步：

　　Mac需要使用zip版本，无需压缩，直接将后缀名改成zip；

　　然后使用终端解压zip文件：unzip Google Access Assistant _v2.3.0.zip -d /Users/ranyihang/Downloads/文件夹名（最好直接解压到文件夹中，易于操作）

　　Extensions--更多工具--Extensions--解压后的扩展中的Home（导入刚才的文件夹）

　　

　　就是这样，按照说明免费激活即可，如果不激活，可以24小时免费使用

　　第三步：

　　重启浏览器，选择chrome store，安装你要的插件

　　

　　安装chrome插件

　　插件一：xpath helperchrome爬虫网页解析工具Chrome插件

　　xpath 是一个结构化的网页元素选择器，支持列表和单节点数据获取，它的好处是可以支持常规的网页数据获取。

　　如果我们要查找某个元素或者某个元素块的xpath路径，可以按住shift移动到这个块，上边的框会显示这个元素的xpath路径，解析后的文本内容会显示在右边，我们可以自己修改xpath路径，程序会自动显示对应的位置；

　　

　　下载后地址栏后面会显示一个❌符号，每次使用都可以点击符号。

　　插件 2：Vue.js devtools：用于调试 vue.js 应用程序的浏览器扩展 Chrome 插件

　　Vue.js devtools 是一个开发者浏览器扩展，用于调试基于 google chrome 浏览器的 vue.js 应用程序。做前端开发的 IT 工程师应该对这个工具比较熟悉，可以在侧边栏窗格中查看页面上的代码。

　　

　　插件 3：React 开发者工具 - React 开发者工具 Chrome 插件

　　React Developer Tools 是一个有用的 Chrome 浏览器扩展，由 facebook 开发，可通过 Chrome Web Storage 获得。使用 Chrome Devtools 进行调试时，您可以查看应用程序的 React 组件层次结构，而不是更神秘的浏览器 DOM 表示。在chrome中添加react开发者工具，是chrome开发工具的React调试工具。React DevTools 是开源的 Chrome DevTools 扩展 React JavaScript 库。它允许您在 Chrome DevTools（以前的 WebKit Web Inspector）中检查 React 的组件层次结构。您将在 Chrome DevTools React 中收到新的选项卡请求。这表明您的根 react 组件正在页面上呈现，并且它们最终正在呈现组件。

　　

　　插件四：Adblock Plus Adblock Plus是一款可以智能屏蔽chrome浏览器广告的插件。

　　

　　下载完成后地址栏后面会显示ABP字样

　　插件五：JSONView：web开发格式化高亮插件Chrome插件

　　Jsonview 是目前最流行的开发者工具插件之一。准确地说，jQuery JSONView 是一个非常实用的 jQuery 插件，用于格式化和语法高亮 JSON 格式的数据查看器。是查看json数据的神器。

　　

　　插件五：Postman Interceptor

　　该插件主要用于测试后台端口是否正确。

　　

　　插件6：FeHelper前端开发助手

　　

　　有json格式化、解码、自动格式化等插件，可以解决很多前端问题。

　　其他插件会陆续更新，敬请期待......