@alekseiami

Проект на VueJS контейнер Docker. Почему не запускается?

Есть проект на VueJS + Vite. Стандартный проект, который формируется командой npm init vue.
Проект был упакован в контейнер Docker.
Dockerfile:

FROM node:lts-alpine

# устанавливаем простой HTTP-сервер для статики
RUN npm install -g http-server

# делаем каталог 'app' текущим рабочим каталогом
WORKDIR /app

# копируем оба 'package.json' и 'package-lock.json' (если есть)
COPY package*.json ./

# устанавливаем зависимости проекта
RUN npm install

# копируем файлы и каталоги проекта в текущий рабочий каталог (т.е. в каталог 'app')
COPY . .

# собираем приложение для production с минификацией
RUN npm run build

EXPOSE 5173
CMD [ "http-server", "--port 5173", "dist" ]


В общем, стандартный файл, взятый отсюда: https://ru.vuejs.org/v2/cookbook/dockerize-vuejs-a.... Только порт поменял. Кроме того, сам проект на Vue3, а докерфайл был под Vue2, но контейнер сформировался корректно.

Упаковал контейнер в файл образа, запустил на компьютере А. Там есть доступ к Интернету и установлен Vue. Проект стал доступен по адресу localhost:5173.

Скопировал контейнер на компьютер Б. Загрузил и запустил образ. Открыл браузер, но на странице localhost:5173 не увидел ничего. В логе единственная запись:
SyntaxError: expected expression, got '?'[Подробнее] index-yQz08yST.js:9:2359


Лог контейнера в докере выглядит так:

Starting up http-server, serving dist

http-server version: 14.1.1

http-server settings: 
CORS: disabled
Cache: 3600 seconds
Connection Timeout: 120 seconds
Directory Listings: visible
AutoIndex: visible
Serve GZIP Files: false
Serve Brotli Files: false
Default File Extension: none

Available on:
  http://127.0.0.1: 5173
  http://172.17.0.2: 5173
Hit CTRL-C to stop the server

[2023-03-29T16:32:26.369Z]  "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
(node:1) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
(Use `node --trace-deprecation ...` to show where the warning was created)
[2023-03-29T16:32:26.392Z]  "GET /assets/index-yQz08yST.js" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:26.393Z]  "GET /assets/index-D6pr4OYR.css" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:26.404Z]  "GET /favicon.ico" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:36.546Z]  "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:36.555Z]  "GET /assets/index-yQz08yST.js" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:36.556Z]  "GET /assets/index-D6pr4OYR.css" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:32:36.564Z]  "GET /favicon.ico" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36"
[2023-03-29T16:33:10.423Z]  "GET /" "Mozilla/5.0 (X11; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0"
[2023-03-29T16:33:10.457Z]  "GET /assets/index-yQz08yST.js" "Mozilla/5.0 (X11; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0"
[2023-03-29T16:33:10.459Z]  "GET /assets/index-D6pr4OYR.css" "Mozilla/5.0 (X11; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0"
[2023-03-29T16:33:10.462Z]  "GET /favicon.ico" "Mozilla/5.0 (X11; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0"


В чём может быть дело? Почему не запускается проект?
На проблемном компьютере Б стоит ОС Astra Linux, доступа к интернету нет, vue не установлен.
  • Вопрос задан
  • 119 просмотров
Решения вопроса 1
Aetae
@Aetae Куратор тега Vue.js
Тлен
Очевидно надо достать кусок кода в index-yQz08yST.js:9:2359 (девятая строка 2359 символ) и посмотреть в чём там проблема.
Навскидку по тексту ошибки могу предположить, что там используется optional chaining (foo?.bar) или nullish coalescing (foo ?? bar), а версия браузера у вас там старая и не поддерживает такой фичи.

...upd: судя по user-agent там хром 70, а минимум для этих фич - хром 80.
Если моё предположение верно(99%), то у вас два варианта: обновить хром на машине, или добавить в билд babel(скорее всего и так добавлен) и прописать в browserlist Chrome <= 70 (а не last 1, что там скорее всего по умолчанию), чтоб при билде он эти фичи заменил на старые альтернативы.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы