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

Question

[alekseiami]

Есть проект на 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 не установлен.

Comments

[Владислав Лысков]

подозреваю что vue 2 не совместим с последней нодой

[alekseiami]

Владислав Лысков, проект на Vue3. Просто докерфайл был взят из инструкции по Vue2.
Опять же, на другой машине (скажем так, первой другой машине) проект открылся как нужно.

Answer 1

[Aetae]

Очевидно надо достать кусок кода в 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, что там скорее всего по умолчанию), чтоб при билде он эти фичи заменил на старые альтернативы.

Comments

[alekseiami]

Спасибо! Буду пробовать.