mizchi

html を 画像化する https://github.com/gripeless/pico の、コアっぽい部分を抜き出した

手順

• html を svg の foreignObject (任意HTMLの埋め込み要素) に描画
• svg を XMLSerializer で data-uri 化
• new Image して img.src に data-uri を流し込む
• canvas に svg を読み込んだ img を renderImage する
• canvas.toDataURL("image/png") で任意のフォーマットで吐き出し

petamoriken

import { useEffect, useState } from "react";

/**
 * @example
 *   const matches = useMatchMedia("screen and (min-width: 560px)");
 *
 * @param raw
 */
export function useMatchMedia(raw: string): boolean {
  const [matches, setMatches] = useState(false);

mjackson

import React from "react";

export type ColorScheme = "light" | "dark";

export default function useColorSchemePreference(
  defaultColorScheme: ColorScheme = "light"
) {
  let darkQuery = "(prefers-color-scheme: dark)";
  let [colorScheme, setColorScheme] = React.useState<ColorScheme>(
    typeof window === "object" && window.matchMedia

sindresorhus

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.