Docker 容器上的 Vue.js 应用程序具有热重载功能

2024-01-01

在 docker 实例上运行 vue.js 应用程序时,出现明显的延迟和高 CPU 使用率。

这是我的码头设置

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.com/ http://localhost:8080/但热重载在 10 秒后发生,然后 15 秒后它不断增加,我的笔记本电脑 CPU 使用率达到 60% 并且仍在增加

我使用的是带有 16 GB RAM 的 Mac Book Pro,对于 docker,我启用了 4 个 CPU 和 6 GB RAM。

如何解决这个问题?


添加其中一项delegated or cached安装应用程序目录的卷的选项。我在使用缓存时经历了显着的性能提升,特别是:

volumes:
  - ~/.composer-docker/cache:/root/.composer/cache:delegated
  - ./:/usr/src/app:cached
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Docker 容器上的 Vue.js 应用程序具有热重载功能 的相关文章

  • 如何从 docker 容器在主机上运行 shell 脚本?

    如何从docker容器控制主机 例如 如何执行复制到主机的bash脚本 这个答案只是一个Bradford Medeiros 解决方案的更详细版本 这对我来说也是最好的答案 所以功劳归于他 在他的回答中 他解释了该怎么做 命名管道 但不完全是
  • 如何在 vue 模板中使用 `console.log` 或 `console.error`?

    我有一个 vue 组件
  • Spring Boot 3 网关显示 503 service_unavailable

    我得到了一个NotFoundException 503 SERVICE UNAVAILABLE网关服务器日志中出现异常 我在 Docker 容器中运行微服务 我有一个auth service处理身份验证和 Jwt 的微服务 我可以使用 Po
  • 如何在 Nuxt 中点击链接下载文件?

    我遇到了一个边缘情况问题 如果用户浏览几条 Nuxt 路线 单击网站 徽标 这是一个锚标记返回主页 然后单击浏览器本机后退按钮 最后单击一个应该的链接要打开 pdf 它会重定向到我的 404 页面 如果用户在页面加载时单击 pdf 链接 它
  • 使用主机上的 consul DNS 解析容器

    目标 让 docker 容器使用主机提供的 DNS 主机是在另一个容器中运行的 consul 代理 来访问通过 traefik 反向代理提供的服务 设置 主机 Ubuntu 16 04 2 LTS Registrator 将新容器注册到 c
  • 是否可以在具有高山风味的 docker 容器内构建 AOSP?

    我对 AOSP 非常陌生 我正在尝试在 Docker 上设置完整的 AOSP 以构建 Docker 映像 例如 Alpine 或 Ubuntu 映像 如果不可能 请让我知道无法在内部设置 AOSP 的原因泊坞窗图像 或者我需要编写 Dock
  • Vue js按钮冻结dom

    我试图在按下按钮时切换包含加载动画的跨度 直到使用 v if 函数完成 但是当我按下按钮时 DOM 冻结并且 span 元素保持不变 直到函数调用结束 如何让 DOM 不冻结并显示加载图标 非阻塞按钮按下可能是一个解决方案 HTML
  • 如何在 Windows Docker 容器中启动 PowerShell (x86)?

    我正在尝试从 PowerShell 启动 Windows Docker 容器中的 PowerShell x86 但它不会启动新的 shell 我正在从 AWS Windows EC2 运行 DockerWindows Server 2019
  • 如何在 vuejs 中防止/停止点击传播

    我有一个递归列表 树 每个元素都有一个 click sayHello el id 现在的问题是 因为它是一个嵌套列表 例如 list element 0 01 list el 1 01 list el 2 01 list el 1 02 l
  • Docker容器内的动态监听端口

    我有一个应用程序 在使用其默认端口建立一些连接后 开始打开 侦听 新的随机端口来处理现有连接 然后删除它们 视频通话 它还在通信协议内交换其IP地址和端口 我能够解决IP地址问题 但仍然无法找到一种方法来动态告诉主机的IPTABLES在Do
  • AWS Lambda Sam找不到docker

    我正在尝试使用以下命令测试我的 hello world lambda 函数aws sam cli在我的项目根文件夹中使用以下命令 sam local start api debug 这在控制台中给出了以下输出 2018 07 11 16 1
  • 将 Select2(多项选择)与 vue.js 结合使用

    我是 vue 新手 并遵循了他们的 自定义指令 http vuejs org examples select2 html http vuejs org examples select2 html 当仅选择一个项目时 此方法效果很好 但当您选
  • 适用于非 Web 应用程序的带有 Docker + IDE 的 Python 工作流程

    我目前正在尝试将 Docker 插入我的非 Web 应用程序的 Python 开发工作流程中 当前使用 Docker 和 IDE 进行 Python 开发的最佳实践是什么 我需要能够使用 Docker 隔离我的环境并调试我的代码 在网上我发
  • VueJS - 验证表单文件上传中的文件大小要求

    我正在使用 Bootstrap Vue 表单制作一个简单的表单 用户可以在其中上传文件 有没有办法验证使用 Vue 表单选择的文件的大小 我想阻止用户上传此类文件 我见过this https stackoverflow com questi
  • 如何使用vue.js获取点击时按钮的值

    我在页面上有几个按钮 它们连接到相同的方法webcamSendRequestButton
  • Vuejs ssr 检查用户是否针对每个请求进行了身份验证

    我正在为我的应用程序使用这个 ssr 样板 https github com vuejs vue hackernews 2 0 https github com vuejs vue hackernews 2 0 我不知道如何实现逻辑来检查每
  • Vue 3 控制台中的 Proxy 是什么意思?

    我正在对数组进行洗牌 并在控制台中收到一条奇怪的消息 我的 JSON 文件如下所示 id 1 name Sushi image https images pexels com photos 1640777 pexels photo 1640
  • 在私有管道中设置 VSTS 代理的 docker 权限

    我已经使用 Linux 虚拟机设置了专用管道 并且安装了代理 并且在门户中显示代理处于活动状态 我也安装了docker 在同一台机器上 如果我使用 sudo docker 它就可以工作 所以我确信 VSTS 代理运行命令时存在权限问题 不确
  • 使用 docker-compose 时如何读取外部机密

    我想知道如何将外部秘密传递到 docker compose 生成的服务中 我执行以下操作 我创造新的秘密 printf some secret value goes here docker secret create wallet pass
  • Laravel Echo 不监听推送事件

    尝试使用 laravel 和 vuejs 创建一种聊天应用程序 发送消息后 我会从 laravel 触发事件 该事件会使用正确的事件类反映在推送器调试控制台上 但根本不会调用来自 vuejs 的监听回调 created window Ech

随机推荐

  • MediaTek 处理器上的双精度值计算错误

    我发现我在市场上发布的一款应用程序在某些手机上产生了奇怪的结果 经过调查发现 一个计算两个地理点之间距离的函数存在问题 有时它会返回完全错误的值 此问题仅在具有以下功能的设备上重现联发科MT6589 http www mediatek co
  • localstorage - 保存数组[重复]

    这个问题在这里已经有答案了 我有本地存储 可以保存输入并将它们推送到列表中 现在我想将列表保存在本地存储中 因为当我重新加载列表时 列表会重置var fav new Array 在此开头定义jsFiddle http jsfiddle ne
  • 如何在 java 中解组 ruby​​ 对象?

    我有一个对象 我想用java获取它的内容 唯一的问题是目前在 ruby 中 irb main 050 0 gt blah gt BAh7ByIeYXV0aGVudGljYXRpb25fc3RyYXRlZ2llczAiCXVzZXJpBg 2
  • AVAudioEngine 在 iOS14 中获取 inputNode 属性崩溃

    这是一个启动audioEngine的函数 void startAudioEngine NSError error nil if self audioEngine isRunning self audioEngine AVAudioEngin
  • Python 装饰器有哪些常见用途? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 虽然我喜欢将自己视为一名相当有能力的 Python 程序员 但我从未理解过的语言的一个方面是装饰器 我知道它们是什么 表面上 我读过 St
  • 如何使用 Sublime Text 3 配置 MinGW?

    我最近安装了 MinGW 并且一直试图让它与 Sublime Text 3 一起使用 以便在编译脚本时打开 cmd 但是没有任何效果 当我去工具 gt 构建系统 gt 新构建系统并保存此脚本 我不断收到错误 C 不被识别为内部或外部命令 可
  • C 中数组索引减去字符意味着什么?

    include
  • 将多个控件放入更新面板的正确方法是什么?

    我有一份注册表单 其中包含 3 到 4 个下拉控件和 2 个日期选择器 现在当选择下拉控件值时 触发 selectedindex 更改 那么我不希望我的页面回发 我已经使用更新面板来停止这种帖子行为 如下所示
  • Spray.io:何时(不)使用非阻塞路由处理?

    如果我们正在考虑生产级 REST API 我们是否应该尽可能使用非阻塞 例如 def insertDbAsync rows RowList Future Unit val route path database insertRowList
  • 在并发环境中处理 max(ID)

    我是 Web 应用程序编程和使用 SQL Server 等 RDBMS 处理并发的新手 我正在使用 SQL Server 2005 Express 版 我正在生成员工代码 其中最后四位数字来自此查询 SELECT max ID FROM e
  • Node.js - Mongoose - 检查集合是否存在

    我需要使用 mongoose 插入一些数据 但集合的名称是由用户在插入时提供的 所以我首先必须检查集合是否存在 我知道如何检查集合是否存在的方法是查询system namespaces收藏 我可以看到 3 种可能的方法来做到这一点 寻找查询
  • 实体框架代码首先创建“鉴别器”列

    我正在使用 EF CF 方法创建一个带有 MySQL 的网站 由于某种原因 EF 在我的 Post 表中创建了一个名为 Discriminator 的列 并包含 VARCHAR Post 为什么要创建这个专栏 我可以做些什么来避免它被创建吗
  • 提交按钮变灰

    我的表单上有一个非常重要的提交按钮 我不希望用户多次点击它 有没有办法让它不可点击或在点击后变灰 也许是点击事件 我的简单代码如下
  • 如何在 SQL 中对连续值进行分组

    我在 SQL Server 2014 中有一个表 其中的示例数据如下 WK NUM NET SPRD LCL 10 0 11 1500 12 3600 13 3800 14 4000 我正在尝试在工作中编写一个奖金结构 我需要在 WK NU
  • 如何在 IDLE 中删除多行制表符缩进?

    如果您想在 Python IDLE 中缩进多行 只需标记这些行并按 Tab 键即可 但是 如果您想删除多行中的缩进怎么办 Shift Tab 在 IDLE 中不起作用 如果您使用 IDLE 则可以使用Ctrl 缩进和Ctrl 取消缩进
  • 在 Perl 中,如何检查给定函数是从哪个模块导入的?

    我有一个调用该函数的代码 但我不知道这个函数属于哪个模块 我需要它来修改这个功能 我怎样才能检查它 The Devel Peek http search cpan org perldoc Devel Peek模块可以非常方便地获取有关变量的
  • 我可以使用 SQL 将存储为 CSV(逗号分隔值)的表列的内容拆分为新表中的各个行吗?

    我看到有几个相关的问题和答案 但不完全是我需要的 所以我会问一个新问题 我有一个包含数千行商店库存数据的 CSV 文件 我想将其导入 MS SQL Server 数据库并使用 SQL 来处理它们 导入 CSV 文件后 SQL 表将具有包含
  • 带空格的 Shell 变量,引用单个命令行选项

    Autoconf 脚本在处 理带有空格的文件名或路径名时遇到问题 例如 configure CPPFLAGS I path with space 结果 config log configure 3012 gcc I path with sp
  • 从字符串中删除最后三个字符

    我想从字符串中删除最后三个字符 string myString abcdxxx 请注意 该字符串是动态数据 从字符串中读取最后 3 个字符 最初提出的问题 您可以使用字符串 子字符串 http msdn microsoft com en u
  • Docker 容器上的 Vue.js 应用程序具有热重载功能

    在 docker 实例上运行 vue js 应用程序时 出现明显的延迟和高 CPU 使用率 这是我的码头设置 docker compose yml version 2 services app build context dockerfil