在github中可以用git，clone下来，链接：https://github.com/vuejs/vue-devtools可以直接下载，解压在windows下解压出来，进入vue-devtools-master文件夹，打开cmd。cmd中敲上命令，npm install，安装完后，输入 npm run build 打包打开vue-devtools-master-》shells-》chrome-》package.json文件中的 "persistent" : false;把false改为true；最后把chrome文件夹直接拖到chrom浏览器中的扩展程序就可以了重新打开浏览器就可以看到V...
前言
浏览器扩展程序是可以修改和增强 Web 浏览器功能的小程序。它们可用于各种任务，例如阻止广告，管理密码，组织标签，改变网页的外观和行为等等。好消息是浏览器扩展并不难写。可以用你已经熟悉的 Web 技术（HTML、CSS 和 JavaScript）创建 —— 就像普通网页一样。但是与网页不同的是，扩展程序可以访问许多特定于浏览器的 API，这才是有趣的地方。在本教程中，我将向你展示如何为 Chrome 构建一个能够改变新标签页行为的简单...
之前找了不少如何开发谷歌插件的文章，结果发现都是些很基础的内容，并没有写到如何快速编译打包插件。我就在想为什么不能通过webpack来打包插件呢？如果通过webpack编译的话，就能使开发过程变得更舒服，使文件结构趋向模块化，并且打包的时候直接编译压缩代码。后来发现了 vue-cli-plugin-chrome-ext 插件，通过这个插件能很方便地用 vue-cli3 来开发谷歌插件，并能直接引用各种UI框架跟npm插件。
tip：如果你没接触过谷歌插件开...
浏览器基本已经天下大统了，放眼望去都是Chromium的天下。那么，能写一个浏览器插件也算是一种回报率不错的技能。
基本知识
浏览器插件官方的说法叫扩展程序，允许你为浏览器增加各种功能，但不需要深入研究浏览器本身的代码。你可以用HTML，CSS和JavaScript创建新的扩展程序，如果你曾经写过网页，那么写一个插件是非常轻松的事情。
常见的插件一般就是地址栏后面的一个图标，点击后给你当前网页提供各种功能，或者在你点击网页右...
背景
对于经常和动画开发打交道的开发者对于Animate.css这个动画库不会陌生，它把一些常见的动画效果都封装起来了，非常实用。但是有时候在开发中，仅仅只是需要某一两个动画效果，把整个CSS文件都引入，这样不是太好。
需求就出现了，能不能有一个工具可以直接预览Animate.css对应的动画效果，并且生成对应的动画代码呢？
作为一个UI开发，平时跟Chrome浏览器打交道最多，于是就整了一个Chrome插件可以及时预览对应Animate.css中的...
是否可以在Chrome中调试.vue组件.到目前为止,我只得到chrome无法记录用于调试的橙色标记源,即我无法检查变量等.
如何做到这一点？解决方法:是的,当然可以.
首先,您需要确保使用的是非缩小版本/非生产版本的Vue.js.您可以通过在控制台输出中查看开发工具来验证这一点.如果您的Vue版本是允许调试的开发版本,则您应该在控制台中看到以下消息.You are running Vue in development mode.
Make sure to turn on production mode when dep...
总体参考：https://cn.vuejs.org/v2/cookbook/debugging-in-vscode.html
注意点：
1、修改 source-map2、设置 webRoot 的路径，要加上"/src"3、选择调试目标，如上图。
其它参考：http://www.r9it.com/20180428/vscode-chrome-debuger.html
目录
1. 下载并解压Vue-Devtools
2. 打开谷歌浏览器的应用商店
3. 安装Vue-Devtools
4. 验证Vue-Devtools是否启动成功1. 下载并解压Vue-Devtoolshttps://codeload.github.com/arcliang/Vue-Devtools-/zip/refs/heads/master
解压后得到2. 打开谷歌浏览器的应用商店谷歌浏览器访问 chrome://extensions/ 开启开发者模式3. 安装Vue-Devtools
得到4. 验证Vue-Devtools是否启动成功关闭谷歌浏览器，重新打开谷歌浏览器，访问vue项目页...
问题一：网上商店用不了怎么下载vue插件http://www.crx4.com/问题二：下载的vue插件无法加载下载的是rar模式安装包不能用。需要解压然后加载插件文件夹问题三：解压载入了还是不能用1.首先文件解压至确保在chrome浏览器插配置问题吧。改配置还不如让把插件放在一起集中管理
路径：C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\Extensions（我是win10）
2.修改插件配置文件：将mainfest.json中代码persis...
VS Code中安装的最新版的Debugger for Chrome扩展程序
更新您的Webpack配置vue.config.js文件中配置：// 是否为生产环境
const isProduction = process.env.NODE_ENV == "production";
const port = 1028; // dev port
module.exports = {publicPath: "./", // 基本路径，打包时加上outputDir: process.env.outputDir || "prod", // 输出文件目录productionSourceMap: !isProduction,configureWebpack: config => {if (process.env...
准备工作
安装node.js，安装过程中会用到npm命令。
下载vue-devtools工具包
官方地址github：https://github.com/vuejs/vue-devtools/tree/master
选择master分支，大家也可以选择其他分支，自己喜欢就好下载完成后解压得到目录vue-devtools-master，进入目录，然后执行 npm install，会看到如下安装过程直到如下过程说明安装成功然后执行命令：npm run build，出现如下视图，说明工具包构建完成
chrome添加vue-devtools插件
进...
