Hung Hoang hunghg255

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:

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.
If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
Stay on the existing version of the package until you can move to ESM.

Cách cơ bản: Dùng svg qua thẻ img hoặc là dùng content của svg trong html
Cách tiếp cận tiếp theo là chuyển hết svg icon thành một bộ font rồi load bộ font,css đó vào source code, sử dùng bên html chỉ cần thêm class của icon.
- Cách này sẽ có nhược điêm là không convert được icon multilplechrome
Cách tiếp theo là chỉ cần chuyển svg thành dataURI rồi dùng trong css, bên html sẽ thêm class icon
- Cũng có một source họ dựng svg dùng với css css.gg nhưng bị giới hạn icon và cách họ xử lý cũng phức tạp.
HTML

	import { useCallback, useEffect, useState } from "react";

	// Define custom types for SpeechRecognition and SpeechRecognitionEvent
	interface ISpeechRecognitionEvent extends Event {
	results: SpeechRecognitionResultList;
	resultIndex: number;
	}

	interface ISpeechRecognition extends EventTarget {
	lang: string;

	# https://cachemon.github.io/SIEVE-website/blog/2023/12/17/sieve-is-simpler-than-lru/#appendix

	class Node {
	constructor(value) {
	this.value = value;
	this.visited = false;
	this.prev = null;
	this.next = null;
	}
	}

	type GetComponentProps<T> = T extends React.ComponentType<infer P>
	? P
	: T extends (props: any) => any
	? Parameters<T>
	: never;


	class ClassComponent extends React.Component<{ a: number }> {
	render() {
	return <div />;

	FROM node:18-alpine AS base

	# Install dependencies only when needed

	FROM base AS deps

	# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.

	RUN apk add --no-cache libc6-compat

	/* eslint-disable quotes */
	import React, { useCallback, useEffect, useState } from 'react';

	const colorSchemes = new Set(['light', 'dark']);
	const MEDIA = '(prefers-color-scheme: dark)';
	const isServer = typeof window === 'undefined';
	const defaultThemes = ['light', 'dark'];

	// Helpers
	const getTheme = (key: string, fallback?: string) => {

	function slugo(input) {
	return (
	input
	// Remove html tags
	.replace(/<(?:.\|\n)*?>/gm, '')
	// Remove special characters
	.replace(/[!\"#$%&'\(\)\*\+,\/:;<=>\?\@\[\\\]\^`\{\\|\}~]/g, '') // eslint-disable-line no-useless-escape
	// Replace dots and spaces with a short dash
	.replace(/(\s\|\.)/g, '-')
	// Replace multiple dashes with a single dash

	import * as React from 'react';

	const useIsFirstRender = (): boolean => {
	const isFirst = React.useRef(true);

	if (isFirst.current) {
	isFirst.current = false;

	return true;
	} else {

	import { splitMessage } from '@utils/common';
	import { useMount } from 'ahooks';
	import { useTranslation } from 'next-i18next';
	import { useState } from 'react';

	import styles from './index.module.scss';

	export const TextSplit = ({
	textContent,
	countSplit,