305371179 / EXDownLoader

下载整站资源、截取屏幕、快速生成二维码的极好用谷歌插件。chrome extension

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

EXDownLoader

vue-cli3 + webpack4 + element-ui 实现编译打包Chrome浏览器插件,集下载、截屏、二维码于一身

界面预览

界面预览

## 项目目录

panel目录


1、dist是生成的插件目录,可以直接被浏览器扩展加载。
2、public是静态资源目录,js不会被编译,beautify是格式化html、js、css的工具类,zip是将文件打包成zip格式的工具类。
3、src是项目的源码,manifest.development.json和manifest.production.json是插件的manifest配置文件,具体可以查看chrome的文档。
4、utils/index.js是下载的核心逻辑,所有与chrome api相关的代码都在此文件里面,hot-reload.js是热更新文件。
5、panel目录是开发者工具插件的页面。

panel目录

环境安装

npm install 或 cnpm install

开发环境

npm run serve
or
npm run build-watch

生产环境打包

npm run build

分析包组件大小

npm run analyze

eslint语法检测

npm run lint

vue-cli3配置文档

vue-cli3配置文档.

Element文档

Element文档.

chrome开发文档

官网被墙,可以看这位大佬的 去看看.

主要学习的开源项目

ResourcesSaverExt.

开发步骤

1、执行npm run build-watch,可以热更新,但是devtools界面是不能自动刷新的,可以点击页面上的刷新面板按钮进行刷新。
2、插件安装,两种方式:
a、加载根目录的dist文件夹

打包插件


b、将打包之后的dist.crx直接拖入chrome/qq浏览器/360浏览器等chrome内核浏览器的扩展组件页面里
3、打包插件,可以直接在谷歌浏览器上打包。打包成功后会在根目录下面生成dist.crx,dist.pem文件。

打包插件


打包插件

打赏鼓励一下,^_^

打赏一下

About

下载整站资源、截取屏幕、快速生成二维码的极好用谷歌插件。chrome extension


Languages

Language:JavaScript 91.8%Language:Vue 7.7%Language:HTML 0.4%