Ответы пользователя spmbt

Почему при запуске сервера Vite выходит ошибка о том, что не найден файл main.jsx?

spmbt @spmbt

Потому что этот файл (или подобный стартовый) должен для Vite лежать в корне проекта, а не в /src, как для Webpack. Не знаю, какими путями у вас он появился в /src - его оттуда руками с правкой путей нужно перенести на правильное для Vite место (про это не так давно (2 мес) статья была на Хабре, плюс у меня Vite стартует из корня, как и полагается ему, и там ставим или index.html, или скриптовой файл.

Ответ написан 01 июл.

Комментировать

CORS error как исправить?

spmbt @spmbt

Чтобы заработали Javascript и CSS в собранном сборщиком файле, в том числе для React, Vue; нужно:
1) убрать и изменить стоп-атрибуты в HTML,
2) сменить абсолютные пути на относительные в ссылках запуска бандлов, стилей и в картинках.

На июль 2025 у Хрома имеются такие "затыки".
*) атрибуты "crossorigin" останавливают с ошибкой в отладчике - убрать эти атрибуты у <script> и <link>
*) в скриптах сборщик проекта пишет &script type="module" ... - это локально не запускается. Заменить на &script type="text/javascript" ..., причём без слова "text/" не пойдёт.
*) все ссылки сборщик проекта любит делать со слешем впереди - а это отсчёт от корня домена: "/assets/... Заменить на относительные ссылки (правильные) или, если надо, абсолютные локальные типа file:///

В итоге, должно получиться что-то типа такого, и это будет запускаться локально.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + Vue + TS</title>
    <link rel="stylesheet" href="assets/index-BA6qXr_z.css">
  </head>
  <body>
    <div id="app"></div>
  </body>
    <script type="text/javascript" src="assets/index-C1hEJ-6O.js"></script>
</html>

Здесь поправлен путь перед vite.svg и assets, плюс правки атрибутов. И чтобы скрипт Vue стартовал - место запуска перемещается вниз, как в HTML показано (а в текущей сборке он был в хедере). (У Реакт19-проекта ничего менять в бандле и положении запуска не приходится.)

Также, можно без переделок пользоваться IDE типа Webstorm со встроенным локальным сервером, у кого она есть - тогда нужно только поправить ссылки (потому что корень сервера будет не от папки ./dist/, а от корня открытого проекта), а CORS не помешает, т.к. уже сервер. Затем, открыть из любого проекта HTML, справа вверху подсветятся значки браузеров - клик по значку, и страница откроется.

Ответ написан 01 июл.

Комментировать

Ошибка в FF DOMException: "The quota has been exceeded."?

spmbt @spmbt

Наблюдал такое в Dev версии Firefox 85.0b4 после длительного пользования, более месяца. Не исключено, что в стабильной версии тоже будет проявляться, но ошибка, видимо, накапливаемая за долгое время, поэтому не знаю, как повторить.

При этом, в неиспользуемой стабильной версии Firefox и в используемой стабильной Chrome - всё нормально.

Проявляется в том, что единственная запись небольшого безобидного значения в localStorage приводит к последующей невозможности записи по ошибке "quota". Проверка реального объёма скриптом записывания в Storage всё более крупного объёма данных показывает, что, в самом деле, ничего записать нельзя. После localStorage.clear() снова оказывается возможной запись, но до меньших пределов, чем прописано в dom.storage.default_quota. Со временем, похоже, есть тенденция этому пределу сокращаться.

Чтению имеющихся записей это не мешает, но удаётся записать до ошибки или очень мало КБ (5-100), или не даёт писать ошибка. indexedDB при этом совершенно пустая на домене, есть лишь немного cookie.

При этом на другом домене этого же браузера всё работает отлично, как и в Хроме.

Хотя очень похоже, что это есть баг браузера, пришлось дописать автоматическую очистку локалстораджа по localStorage.clear(), с восстановлением своих записей, так как не исключено, что в стабильных версиях браузера она тоже будет наблюдаться.

А описать багрепорт невозможно, т.к. неизвестна процедура воспроизведения.

Войдите на сайт