使用Docker容器实现Vue.js应用程序的热重载

Question

当我在Docker实例上运行我的Vue.js应用程序时，遇到了显著的延迟和高CPU使用率。

这是我的Docker设置

docker-compose.yml

version: '2'
services:

  app:
    build:
      context: ./
      dockerfile: docker/app.docker
    working_dir: /usr/src/app
    volumes:
    - ~/.composer-docker/cache:/root/.composer/cache:delegated
    - ./:/usr/src/app
    stdin_open: true
    tty: true
    environment:
    - HOST=0.0.0.0
    - CHOKIDAR_USEPOLLING=true
    ports:
    - 8080:8080

应用程序 - Docker

# base image
FROM node:8.10.0-alpine

# Create app directory
WORKDIR /usr/src/app

# Install app dependencies
COPY package*.json ./

RUN npm install

# Bundle app source
COPY . .

EXPOSE 8080

CMD [ "npm", "run", "serve"]

当我输入docker-compose up -d时，这个设置能够正常工作，我的应用加载在http://localhost:8080/ 但是10秒钟后，热重载开始出现，然后15秒钟之类的，它会不断增加，我的笔记本电脑CPU使用率达到了60%，并且还在增加。

我使用的是16 GB RAM的MacBook Pro电脑，对于Docker，我已经启用了4个CPU和6 GB RAM。

如何解决这个问题？

- dev1234

---

你尝试过使用 CHOKIDAR_INTERVAL=1000 设置间隔吗？ - Azraar Azward

Answer 1

将delegated或cached选项之一添加到挂载您的应用目录的卷中。我尤其使用cached选项获得了显着的性能提升：

volumes:
  - ~/.composer-docker/cache:/root/.composer/cache:delegated
  - ./:/usr/src/app:cached

- Brian Lee