Владимир

Дев сервер webpack не складівает ничего виртуально, кроме того там live reload есть.
На самом деле в дев сервере порт поменят не пороблема, а вот SSL уже не прикрутишь. Поєтому ставь nginx и натравливай его на свой localhost:3000. Если хочешь нгинкс ставить в виртуалке, то и разработку прийдется вести в виртуалке, поєтому не заморачивайся и ставь его локально, ну если прям ну очень секса хочется, то учи докер а не дрочи с виртуалками.

1) Зачем мусорить в глобальной области видимости?
Оберни весь код в IIFE
https://developer.mozilla.org/en-US/docs/Glossary/...
Таким образом изолируешь свои переменные от глобальных, и точно ничего не перетрешь в глобальной области.
2) Если хочешь получить помощь, оформляй снипет так чтобы другой мог его запустить
Вот эта строка <script src = "d3.min.js"></script> не будет работать у других.
Я пробовал заменить на

<script src="https://d3js.org/d3.v7.min.js"></script>

при этом код не работает и ошибок не выдает.

https://reactjs.org/docs/animation.html

Немає помилок

const messages = [{
    id: 1,
    subType: 'warning'
  },
  {
    id: 2,
    subType: 'info'
  },
  {
    id: 3,
    subType: 'some'
  },
];
const newMessages = messages.map(({id, subType}) => ({
  explanation: '',
  messageid: id,
  type: (subType === 'warning') ? 'warn' : (subType === 'info') ? 'info' : 'error'
}));

console.log(newMessages);

Все очень просто.
say это простая функция, у нее глобальный контекст в зависимости от strict mode это undefined или window
Для того, чтобы избежать путаницы, используй strict mode
f это метод, если ты его вызываешь как метод - контекст это родитель, если как функцию, он потеряет контекст
https://developer.mozilla.org/en-US/docs/Web/JavaS...
https://github.com/getify/You-Dont-Know-JS/blob/1s...

Итак, как раз для прокрутки addEventListener и removeEventListener использовать в реакте вполне легально.
Более того, вы вполне обошли использование рефов используя window, тут все хорошо.
Но вот на следующих граблях - жизненном цикле вы таки споткнулись.
Где гарантия, что компонент не перерендерился и функция disableOnwheel осталось той же что и была ?
Нужно
1) Вынести disableOnwheel за пределы компонентов, там нет ничего что зависело бы от наличия React
2) Внимательно прочесть про клинап https://reactjs.org/docs/hooks-effect.html

В чем смысл подключать этот файл со стороннего ресурса?
Или используй его с CDN, он уже настроен для отдачи нужных CORS заготовков, или просто добавь его в клиенский проект через NPM локально.
Кроме того, зачем ты пытаешся отдать статичный js файл через ноду, для этого обычно настраивают nginx чтобы он отдавал статику
То что ты делаешь это странное извращение.
Если чисто академический интерес, то опиши чего именно ты хочешь добиться.

Не нужно чтобы он игнорировал импорты. Просто внешние модули нужно мокать.
https://jestjs.io/uk/docs/mock-functions