Vite + Docker создание docker image vite приложения и локальный запуск с помощью docker

Рет қаралды 3,107

Жыл бұрын

Здесь выложены команды и код который я использовал
Dockerfile записать файл с этим названием в корень проекта:
FROM node:18.13.0-alpine
WORKDIR /app
COPY ./package.json .
RUN npm install
COPY . .
CMD [ "npm", "run", "dev" ]
Добавить этот код в файл vite.config.ts под строчкой plugins: [react()],:
server: {
watch: {
usePolling: true,
},
host: true,
strictPort: true,
port: 5050
}
Команда для сборки docker image:
docker build -t test .
Команда для запуска docker container:
docker run --rm --name myViteProject -p 3000:5173 -d test
docker run --name myViteProject --restart=always -p 3000:5173 -d test //после перезагрузки запуститься заного
docker ps -a для просмотра запущенных и остановленных контейнеров
docker stop test //остановка контейнера

Пікірлер: 33

@frontfromsofa 8 ай бұрын

Самый понятный и рабочий урок по vite react docker. Спасибо!

@yesdoit9914 8 ай бұрын

Добрый день! Удачи в программировании!!!

@AGM140580 6 ай бұрын

Просто и доходчиво! Спасибо!

@yesdoit9914 5 ай бұрын

Рад если Вам помогло мое видео!!!

@alexpipin3693 28 күн бұрын

спасибо выспался!

@yesdoit9914 28 күн бұрын

))

@arthurshaidullin7981 8 ай бұрын

было полезно, спасибо

@yesdoit9914 8 ай бұрын

И Вам спасибо 👍

@eugeneeremin 9 ай бұрын

Спасибо помогло!

@yesdoit9914 9 ай бұрын

Рад что помог Вам!!! 👍

@mymail333g 7 ай бұрын

Столкнулся с проблемой, что из под Docker не хотело работать. Помог ваш совет по поводу настройки объекта server. Только я оставил два параметра: host и port. usePolling: true - это под винду WSL2, а у меня linux, да и у вас, я так понимаю, тоже linux strictPort - тоже не нужен оказался, у меня эти порты свободны

@yesdoit9914 7 ай бұрын

Классно что смогли разобраться ! Успехов Вам !

@samolevich 5 ай бұрын

Супер

@yesdoit9914 5 ай бұрын

Рад если мое видео было Вам полезно! 🙂👍

@samolevich 5 ай бұрын

@@yesdoit9914еще как!

@pir0zh0kDevTV 3 ай бұрын

Спасибо! Конечно, все равно ничего не работает, но спасибо!

@yesdoit9914 3 ай бұрын

Приветствую! можешь скинуть ссылку на свой проект мне на почту я посмотрю где ошибка

@TheTempest_ 2 ай бұрын

Гад блесс ю

@yesdoit9914 2 ай бұрын

)

@indigosay 9 ай бұрын

Горячая перезагрузка не работает во время правок

@yesdoit9914 9 ай бұрын

Добрый вечер Вы работаете в VSCode?

@indigosay 9 ай бұрын

@@yesdoit9914 да

@yesdoit9914 9 ай бұрын

@@indigosay Сборщик Vite используете? как на видео? Установлены ли у вас Babel JavaScript в VSCode Extentions?

@yesdoit9914 9 ай бұрын

@@indigosay Live Server в VSCode Extentions

@yesdoit9914 9 ай бұрын

1) попробуйте зайти в настройки и проверить vite.config.js server: { Проверить эту строку должно быть true hmr: { overlay: true, }, }, 2) Важно какой браузер используете по умолчанию 3) Попробуйте сбросить кэш браузера и перезапустить приложение Vite и сам VSCode 4) проверьте есть ли ошибки в консоли в браузере когда запускается ваша страничка (не должно быть конфликтов) 5) Возможно есть какието extention которые конфликтуют с сборщиком. Как вариант можно попробовать переустановить VSCode

@AGM140580 6 ай бұрын

Сначала я пытался в Dockerfile выполнять команду npm run build а затем запускать приложение с помощью строки CMD ["npm", "run", "preview"] При этом приложение вне контейнера оставалось недоступно. Помогла настройка vite.config.js preview: { host: true, port: 8080, }, по аналогии с настройкой server.

@yesdoit9914 6 ай бұрын

Приветствую доступ к контейнеру получить можно через exec