Александр

const download = (fileUrl, filename) => {
  fetch(fileUrl)
    .then(response => response.blob())
    .then(data => {
      const tempUrl = URL.createObjectURL(data);
      const link = document.createElement('a');

      link.href = tempUrl;
      link.download = filename;

      link.addEventListener('click', () => {
        setTimeout(() => {
          URL.revokeObjectURL(tempUrl);
        });
      });

      link.click();
    });
};

window.addEventListener('DOMContentLoaded', () => {
  download('MY_URL', 'MY_FILENAME.txt');
});

https://codesandbox.io/s/qna-q954721-2zokd

- errors.field.name
+ errors[field.name]

Также и для touched.

Можно сделать без хэша https://codesandbox.io/s/qna-q953069-ih1rt

https://css-tricks.com/styling-cross-browser-compa...

https://codesandbox.io/s/qna-q952763-1d7b6

const combine = ({
  entries = [],
  createItem = entry => entry,
  getParent = entry => entry,
  getChild = entry => entry,
  getKey = entry => entry.id
}) => {
  const cache = new Map();
  
  return entries.reduce((accumulator, entry) => {
    const parent = getParent(entry);
    const child = getChild(entry);
    const key = getKey(parent);
    
    if (!cache.has(key)) {
      const branch = {
        ...createItem(parent),
        children: []
      };
      cache.set(key, branch);
      accumulator.push(branch);
    }
    
    cache.get(key).children.push(createItem(child));
    
    return accumulator;
  }, []);
};

const result = combine({
  entries: columnList,
  createItem: entry => ({
    key: `${entry.name}-${entry.id}`,
    title: entry.name
  }),
  getParent: entry => entry.table
});

Функции плавности можно посмотреть тут.

Необходимо настроить Nginx на отдачу только /index.html - 1, 2, 3.

Второй вариант почти правильный.
1. Событие добавляете внутри useEffect;
2. В deps передаете пустой массив;
3. В рендере можно написать проще, не используя шаблонную строку.

const PageSize = () => {
  const [pageSize, setPageSize] = useState([document.documentElement.scrollWidth, document.documentElement.scrollHeight]);

  const updatePageSize = () => setPageSize([document.documentElement.scrollWidth, document.documentElement.scrollHeight]);

  useEffect(() => {
    window.addEventListener('resize', updatePageSize);

    return () => {
      window.removeEventListener('resize', updatePageSize);
    };
  }, []);

  return (
    <div>
      <p>page width is {pageSize[0]}</p>
      <p>page height is {pageSize[1]}</p>
    </div>
  );
};

Допустим у Вас есть компонент, который при появлении на странице (монтировании) добавляет глобальную прослушку события, например - mousemove. Приложение работает, всё хорошо, но потом, по некоторой причине, происходит размонтирование и через некоторое время снова монтирование. В таком случае, если не удалить прослушку, будет уже 2 события, что и является утечкой памяти.
Также происходит таймерами и интервалами, поэтому надо отменять их при размонтировании.
Как пример, советую посмотреть это видео.

Используйте cmd.

Если среда исполнения браузер, то <script src="" type="module"></script>. Если среда исполнения node, то в package.json "type": "module".