Изображение докера VueJs не загружается в браузере

ВОПРОС: (отредактировано: решение добавлено в конце этого сообщения)

У меня есть проект VueJS (разработанный в веб-пакете), который я хочу использовать в докере.

Мой Dockerfile выглядит так:

FROM node:8.11.1 as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 8080
CMD ["npm", "run", "dev"]

который в основном следует потоку из этот пост.

У меня также есть файл .dockerignore, в который я скопировал те же файлы из моего .gitignore, и он выглядит так:

.DS_Store
node_modules/
/dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
.git/

Я создал образ докера с помощью команды:

 docker build -t test/my-image-name .

а затем запустите его в контейнер с помощью команды:

 docker run -it -p 8080:8080 --rm --name my-container-name test/my-image-name

в результате этой последней команды я получил тот же вывод в терминале (который обычно отображается в случаях отладки с помощью webpack/vuejs), что и при локальном запуске приложения:

введите здесь описание изображения

НО: в конце в окне браузера приложение не загружается

Если я запускаю команды docker images и docker ps, я вижу, что изображение и контейнер есть, и при их создании я не получил никаких сообщений об ошибках.

Я нашел этот пост и предпринял несколько попыток изменить файл Dockerfile следующим образом:

Опция 1

FROM node:8.11.1 as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .    
EXPOSE 8080
ENTRYPOINT ["ng", "serve", "-H", "0.0.0.0"]

Вариант 2

FROM node:8.11.1 as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
ENTRYPOINT ["ng", "serve", "-H", "0.0.0.0"]
EXPOSE 8080
CMD ["npm", "run", "dev"]

Но, похоже, ни один из них не работает.

кстати. мой файл package.json выглядит так:

  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "build": "node build/build.js"
  }

Итак, мне интересно: как сделать так, чтобы приложение открывалось в браузере из образа докера?


person delux    schedule 02.10.2018    source источник
comment
stackoverflow.com/questions/52401606/   -  person Adiii    schedule 03.10.2018
comment
Пожалуйста, опубликуйте логи контейнера: docker log <container id>   -  person jannis    schedule 03.10.2018
comment
Я нашел решение и отредактировал пост, чтобы он также содержал ответ.   -  person delux    schedule 03.10.2018
comment
Было бы лучше опубликовать его как ответ и принять его (одной из причин является индексация Google).   -  person jannis    schedule 05.10.2018
comment
Благодарю вас! Это сработало для меня. Даже при включении строки EXPOSE 8080 в файл докера.   -  person Thomas M    schedule 31.08.2020


Ответы (1)


РЕШЕНИЕ: нет, конечно, это было причиной исправления, но я сделал две вещи. Как уже упоминалось, я работаю с VueJS и веб-пакетом, поэтому внутри файла с именем config/index.js, который изначально выглядел так:

module.exports = {   
  dev: {    
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},

// Various Dev Server settings
host: 'localhost', // <---- this one
port: 8080,

Я изменил свойство host с 'localhost' на '0.0.0.0', удалил строку EXPOSE 8080 из Dockerfile (исходный файл Docker из моего вопроса выше), так как заметил, что порт из файла конфигурации используется по умолчанию, а также перезапустил установленный инструмент Docker на моем локальная машина.

person delux    schedule 01.09.2020