зачем бежать впереди паровоза? Не хотите делать рендер пока не установился нужный стейт - выводите лоадер. Установится нужный стейт, меняйте лоадер на полный код рендера.
Попробуйте очистить кеш - по пути C:\Users\TestX\AppData\Local\npm-cache\
Затем обновите npm npm update npm -g
и попробуйте после этого установить реакт.
ну я делаю так - из обводки делаю маску, под неё кладу прозрачный слой, на котором градиент от прозрачного к белому и обратно (получается белая линия с прозрачными краями). Затем в gif или svg этот слой можно анимировать - движение перпендикулярно белой линии. Получится проходящий блик по контуру.
я думаю так - при первом проходе в микростек добавляются промис и последний setTimeout. Затем из стека пытается выполнится промис, но внутри новый setTimeout, который опять улетает в микростек. Дальше уже понятно.
Проблема в том, что вы не имеете ни опыта, ни знаний для написания подобных приложений. Для начала, нужно написать, что-то по-проще и досконально разобраться с жизненным циклом реакт-компонентов. Т.е. четко уяснить что, в какой последовательности исполняется и как взаимосвязано.
Касательно, вашего кода - новички ударяются в 2 крайности, или совсем не используют состояния, или пишут целые простыни. Я насчитал в вашем компоненте 10 useState - вам действительно необходимо такое количество в таком простом компоненте?
И открою вам один маленький, но очень важный секрет - useEffect-ов в одном компоненте может быть больше одного!
Сделайте для каждой ф-и глобальную переменную-флаг, которые они будут проверять периодически при работе. Если флаг true - продолжают работать, false - завершаются. Примерно так:
let NY = true
function timerNY() {
while(NY && ваши условия повтора){
// основной код ф-ии
}
}
в момент когда нужно завершить работу ф-ии меняете флаг на false NY = false
Но это один из вариантов, можно и другие сделать через интервал и очистку.
Максим Белоусов, странно, по идее должно работать правильно. А к остальным ресурсам правильные пути получаются (img, svg) ? Возможно еще конфиг тайпскрипта на это как-то влияет...