如何在 docker 容器中使用 gulp 运行 livereload?

问题描述

我创建了一个 docker 容器来使用 gulp 运行任务.所有任务都在运行，问题是我无法在 Chrome 中启用 livrereload，尽管我在容器中暴露了 35729 端口.

I created a docker container to run tasks with gulp. All tasks are running, the problem is I can't enable livrereload in Chrome although I exposed the 35729 port in my container.

这里是 Dockerfile:

Here is the Dockerfile :

FROM ubuntu:latest
MAINTAINER jiboulex

EXPOSE 80 8080 3000 35729

RUN apt-get update
RUN apt-get install curl -y
RUN apt-get install software-properties-common -y
RUN add-apt-repository ppa:chris-lea/node.js
RUN apt-get update
RUN apt-get install nodejs -y
RUN curl -L https://www.npmjs.com/install.sh | sh
RUN npm install --global gulp -y

# overwrite this with 'CMD []' in a dependent Dockerfile
CMD ["/bin/bash"]

我使用以下命令创建图像:

I create the image with the following command :

docker build -t gulp_image .

我创建了一个容器:

docker run --name=gulp_container -i -t  --rm  -v /var/www/my_app:/var/www/my_app:rw gulp_image bash

然后在我的容器中

cd /var/www/my_app
gulp

这是我的 Gulpfile.js

Here is my Gulpfile.js

var gulp = require('gulp'),
livereload = require('gulp-livereload'),
exec = require('child_process').exec;
gulp.task('js', function() {
gulp.src([
    './src/js/*.js'
]).pipe(livereload());
});
gulp.task('watch', function(){
var onChange = function (event) {
    console.log('File '+event.path+' has been '+event.type);
};
livereload.listen();
gulp.watch([
    './src/js/*.js'
], ['js'])
    .on('change', onChange);
});
gulp.task('default', ['watch', 'js']);

当我编辑一个 js 文件时，我可以在我的容器中看到文件已被处理，但是当我尝试在我的浏览器 (Chrome) 中启用实时重新加载时，我收到以下消息:无法连接到 LiveReload 服务器.."

When I edit a js file, I can see in my container that the files are processed but when I try to enable live reload in my browser (Chrome), I got the following message : "Could not connect to LiveReload server.."

有人知道我错过了什么或没有做什么吗?感谢阅读！

Anyone got a clue about what I missed or didn't do ? Thanks for reading !

推荐答案

在容器中暴露端口并不意味着将在 docker 主机上打开端口.您应该使用 docker run -p 选项.文档说:

Exposing ports in a container does not imply that the ports will be opened on the docker host. You should be using the docker run -p option. The documentation says:

-p=[] : 将容器的端口或一系列端口发布到主机

-p=[] : Publish a container᾿s port or a range of ports to the host

格式: ip:hostPort:containerPort |ip::containerPort |hostPort:containerPort |containerPort

hostPort 和 containerPort 都可以指定为一个端口范围.

Both hostPort and containerPort can be specified as a range of ports.

为两者指定范围时，范围内的容器端口数必须与范围内的主机端口数匹配.(例如，-p 1234-1236:1234-1236/tcp)(使用 'docker port' 查看实际映射)

When specifying ranges for both, the number of container ports in the range must match the number > of host ports in the range. (e.g., -p 1234-1236:1234-1236/tcp) (use 'docker port' to see the actual mapping)

由于您尝试了 -p containerPort 形式，当您运行 docker run 命令时，docker 会随机选择在您的主机(Linux mint)上打开的实际端口.要确定选择了哪个端口，您必须使用 docker port 命令.

Since you tried the -p containerPort form, the actual port opened on your host (Linux mint) was randomly chosen by docker when you run the docker run command. To figure out what port was chosen, you have to use the docker port command.

由于不方便，所以应该使用-p hostPort:containerPort形式，并指定hostPort为35729.(我还假设您希望端口 80、8080 和 3000 可以以相同的方式访问)

Since this is not convenient, you should use the -p hostPort:containerPort form, and specify that hostPort is 35729. (I also assume you expect ports 80, 8080 and 3000 to be accessible in the same manner)

运行容器的命令是:

docker run --name=gulp_container -i -t --rm 
    -v /var/www/my_app:/var/www/my_app:rw 
    -p 35729:35729 
    -p 80:80 
    -p 8080:8080 
    -p 3000:3000 
    gulp_image bash

处理端口的更简单方法是在 主机网络模式下运行 docker 容器.在这种模式下，在容器上打开的任何端口实际上都是在主机网络接口上打开的(它们实际上都是共享同一个接口).

An easier way to deal with ports is to run your docker container in host networking mode. In this mode, any port opened on the container is in fact opened on the host network interface (they are actually both sharing the same interface).

然后您将使用以下命令启动您的容器:

You would then start your container with:

docker run --name=gulp_container -i -t --rm 
    -v /var/www/my_app:/var/www/my_app:rw 
    --net=host  
    gulp_image bash

这篇关于如何在 docker 容器中使用 gulp 运行 livereload?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持html5模板网！