年度最受欢迎的开源Chrome插件出炉

2021-12-23

TJ君

Chrome插件

DD的博客全面升级，阅读体验更佳（尤其是系列教程），后续不再通过这里发布新文章，而是改到 www.didispace.com 发布啦，奔走相告！点击直达～

又到了年底，时间过得飞快，每到年底就有各种各样的总结各种各样的奖项出来。前几天谷歌就公布了2021年年度最受欢迎Chrome插件名单，名单共有13个。

让很多网友费解的是，其中有很多并不是今年刚出现的新插件，大家心里的疑问是年底评选不是应该只评当年的新货色吗？

对于这个话题，每个人都有自己的理解，TJ君也不准备多讨论，不过既然能进入榜单的肯定都是不错的插件，其中也不乏开源的作品，所以今天TJ君就准备给大家分享榜单中的几款开源插件！（想看下以前推荐的插件吗？点这里）

Dark Reader

这款开源插件可能不少小伙伴已经在用了，毕竟已经是个上线多年的老面孔了，不过可能因为Chrome自己一直没有推出类似的黑夜模式，所以也算是一直在金字塔尖的存在。

Dark Reader，是一款主打黑暗风格的插件，可以实现一键切换，并进行各种亮度、对比度等指数的调整。

Dark Reader

很多小伙伴都觉得黑色，黑暗模式，可以让自己的双眼更舒服。

开源的Dark Reader项目提供三种不同的安装方式：

从NPM安装软件包
或从源代码生成（NPM运行api）
或者通过CDN（如unpkg或jsDelivr）

可以使用以下代码来控制Dark Reader的API：

DarkReader.enable({
    brightness: 100,
    contrast: 90,
    sepia: 10
});

DarkReader.disable();

// Enable when the system color scheme is dark.
DarkReader.auto({
    brightness: 100,
    contrast: 90,
    sepia: 10
});

// Stop watching for the system color scheme.
DarkReader.auto(false);

// Get the generated CSS of Dark Reader returned as a string.
const CSS = await DarkReader.exportGeneratedCSS();

// Check if Dark Reader is enabled.
const isEnabled = DarkReader.isEnabled();

ES 模式下是这样的：

import {
    enable as enableDarkMode,
    disable as disableDarkMode,
    auto as followSystemColorScheme,
    exportGeneratedCSS as collectCSS,
    isEnabled as isDarkReaderEnabled
} from 'darkreader';

enableDarkMode({
    brightness: 100,
    contrast: 90,
    sepia: 10,
});

disableDarkMode();

followSystemColorScheme();

const CSS = await collectCSS();

const isEnabled = isDarkReaderEnabled();