记录一下docker搭建本地vue开发环境遇到的问题，启动项目没报错浏览器打开项目白屏，连本地启动的后端项目连不上的情况

最新推荐文章于 2024-10-18 22:36:34 发布
最新推荐文章于 2024-10-18 22:36:34 发布
阅读量235 收藏
点赞数 2
文章标签： docker 容器 运维
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_73738273/article/details/142102477
版权

第一个问题启动项目没报错浏览器打开项目白屏是因为启动docker容器的内部端口和暴露端口不一致导致的。

第二个问题连本地启动的后端项目连不上的情况，正常连本地项目是target:http://localhost:8899,但是现在vue项目是跑在容器中，localhost找容器里这个端口根本找不到运行后端程序，二种方案，要么把后端项目和vue项目跑到一个容器中，或者把localhost改成本机ip

从不敲代码
关注
Docker容器已成功启动，浏览器却访问不到
cs_x123的博客
04-16 1018
我在虚拟机上用docker容器启动了MySQL和nacos，但是当我使用navicat与MySQL建立连接时却一直报Timeout connection；我使用虚拟机ip地址:8848/nacos也无法访问成功。最后从主机cmd窗口ping虚拟机ip，发现无法ping通，但从虚拟机ping主机ip可以ping通。根据搜索，查看了虚拟机防火墙暴露出来的端口以及IPv4转发是否已开启，发现也没有任何问题。进一步查看网络设置发现是网卡被禁用了，启用即可。
「 Vue×Docker」服务器部署Vue遇到的那些坑
Hugh
06-13 6850
项目之前一直在电脑本地做的，废弃了很久才想起来部署到服务器上。因为是第一次用vue，发布时遇到了很多问题，用了5个小时才解决掉。 主要问题有两个： 1. 不清楚如何发布vue项目，服务器上npm run dev只能本地测试使用。 2. 数据接口的代理加载不出资源。 服务器环境： linux 7.0 x86_64 npm 6.1.0 vue 2.9.6 docker...
花椒前端基于 Docker 的 SSR 持续开发集成环境实践
程序员成长指北
07-29 265
项目收益整体开发效率提升20%。加快首屏渲染速度，减少白屏时间，弱网环境下页面打开速度提升40%。权衡在选择使用SSR之前，需要考虑以下事项！SSR需要可以运行Node.js的服务器，学...
前端知识宝典
qq_37759901的博客
01-29 878
搜索框输入，文本剪辑器实时保存代码实现思路如下：（利用定时器，每次触发先清掉以前的定时器，从新开始）
20-50K 前端工程师的部分面试题集锦 - 附答案
qq_43623970的博客
05-13 1529
现在 20-50K 的招聘，我们先看看是什么要求？ 蚂蚁金服招聘要求： 虾皮招聘： 腾讯： 明源云： 毫无疑问，这些公司都是招聘的大前端技术栈的职位，之前文章提到过 2020 年大前端最理想的技术栈，其实真的弄得很明白那些，出去面试基本上不会有什么问题。 小提示：如果发现小公司面试套你的技术和架构，迅速结束，开出天价薪资走人。 下面正式公布部分面试题，以及答案： 出于对各个公司的尊重，不公布是哪家公司的面试题，以及面试技巧。只公布部分面试题和答案，以及分析问题的角度，学习方向，面试中考察的不仅仅技术
前端面试题个人总结（根据个人面试情况更新）
sy_strive的博客
04-27 741
Ⅰ、uniapp 应用的生命周期、页面的生命周期onLaunch——当uni-app 初始化完成时（全局只触发一次）onShow——当 uni-app 启动时，或从后台进入前台显示onHide——当 uni-app 退出时（从前台进入后台）onError——当 uni-app 报错时页面的生命周期onLoad——监听页面加载onShow——监听页面显示onReady——监听页面渲染onHide——监听页面隐藏onUnload——监听页面卸载Ⅱ、uni-app的跳转()使用。
关于20-50K 前端工程师的部分面试题集锦 - 附答案
hfdxmz_3的博客
05-14 507
腾讯： 明源云： 毫无疑问，这些公司都是招聘的大前端技术栈的职位，之前文章提到过 2020 年大前端最理想的技术栈，其实真的弄得很明白那些，出去面试基本上不会有什么问题。 小提示：如果发现小公司面试套你的技术和架构，迅速结束，开出天价薪资走人。 下面正式公布部分面试题，以及答案： 出于对各个公司的尊重，不公布是哪家公司的面试题，以及面试技巧。只公布部分面试题和答案，以及分析问题的角度，学习方向，面试中考察的不仅仅技术深度，还有广度，每个人不可能技术面面俱到，前端学习的东西太多，忘掉一部分也
使用 Docker 高效搭建本地开发环境（详细教程）
weixin_70730532的博客
08-14 3607
DockerDocker 是一个开源的应用容器引擎，让开发者可以打包他们的应用以及依赖包到一个可移植的容器中，然后发布到任何流行的Linux机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口。对我们而言，我觉得只需要把他理解成一个便携的应用容器即可Docker。...
Docker打包vue项目镜像（开发环境）
qq_37312180的博客
10-17 1653
docker run -d -p 3006:80 vue_npm_arcgis_image2 #启动（运行）容器。docker build . -t vue_npm_arcgis_image2 #打包成docker镜像。运行npm run docker打包docker镜像并启动（运行）容器。vue_npm_arcgis_image2 镜像名称。浏览器访问http://IP:Port测试。-t title设置镜像名称。
Docker快速搭建java后端开发环境教程（详细图文结合）
weixin_44499403的博客
09-27 1万+
Docker快速搭建java后端开发环境教程1.Docker常用命令2.镜像相关命令3.容器相关命令3.1.查看容器3.2查看容器ip3.3启动与停止容器3.4删除容器4. Docker应用部署4.1安装java环境4.2安装redis4.3安装mysql5.查看已有镜像与运行容器 关于Centos7安装docker，在我上一篇博客详情介绍Centos7安装docker 1.Docker常用命令    镜像： Docker镜像是由文件系统叠加而成（是一种文件的存储形式）；是docker中
在Docker中使用Nginx部署Vue项目
什么都干的派森
04-18 5614
文章目录一、前置需求1.liunx环境2.安装Docker二、部署方法1.打包Vue项目2.Docker拉取Nginx镜像3.创建一个打包镜像的目录4.上传Vue项目5.编写Nginx配置文件6.编写Dockerfile7.创建镜像8.启动容器三、访问测试 一、前置需求 1.liunx环境 本人用的 Centos7 2.安装Docker 参考这篇文章 https://blog.csdn.net/weixin_43721000/article/details/124237932 二、部署方法 1.打包Vu
【Jenkins+Docker】持续集成与交付 （十九）：使用Jenkins自动化从GitLab拉取项目源码，本地构建并发布Docker镜像
热门推荐
✨ 欢迎来到【Seal ^_^ 的CSDN博客】！这里是我记录技术心得、分享经验的地方。✨
05-06 1万+
🟣【Jenkins+Docker】持续集成与交付 （十九）：使用Jenkins自动化从GitLab拉取项目源码，本地构建并发布Docker镜像
[k8s理论知识]5.docker基础（四）Dockerfile构建
weixin_45396500的博客
10-18 622
查看95158的命名空间和容器60170的命名空间，发现是一样的。已知一个容器的pid 1为主进程，在我们的例子中是app.y，而docker exec实际上是把bin/bash进程放入了和容器相同的命名空间里面，所以当我们查看进程的时候，会有一个进程编号为17的进程。查看该PID的namespace，可以看到，一个进程的每种 Linux Namespace，都在它对应的 /proc/[进程号]/ns 下有一个对应的虚拟文件，并且链接到一个真实的 Namespace 文件上。可以看到容器进程的PID。
[k8s理论知识]4.docker基础（三）镜像分层
weixin_45396500的博客
10-18 259
上一节内容讲了Docker的文件系统的挂载和隔离，也讲了Docker镜像打包了一部分的操作系统，既操作系统的文件系统和配置文件。但是容器在宿主机上运行的时候只能使用宿主机内核，这也带来了一定的局限性，就是高版本的docker镜像无法运行在低版本的宿主机上。
[k8s理论知识]3.docker基础（二）隔离技术
weixin_45396500的博客
10-18 735
容器其实是一种沙盒技术，其核心是通过约束和修改进程的动态表现，为其创建一个边界。这个边界确保了应用与应用之间不会相互干扰，同时可以方便在不同的环境中迁移，这是PaaS最理想的状态。程序是代码的可执行镜像，通常以二进制文件的形式存储在磁盘上。但是当程序被执行时，操作系统会将程序的数据加载到内存中，读取计算指令并指示CPU执行。CPU与内存协作进行计算，使用寄存器存放数值，内存堆栈保存执行的命令和变量，此外，程序还可能打开文件和调用IO设备。所有这些状态信息和数据信息的集合，构成了进程的动态表现。
Docker实战：从入门到进阶
最新发布
进击的码农
10-18 265
除了使用官方镜像，我们还可以构建自定义的镜像。FROM nginx这个Dockerfile基于Nginx镜像，并将当前目录下的my_website文件夹复制到容器的目录下。这条命令会构建一个名为my_nginx的镜像，表示Dockerfile位于当前目录。访问，你将看到my_website文件夹下的内容。Docker是一个强大的工具，它改变了我们构建、打包和部署应用程序的方式。通过本文的实战和应用举例，希望你能对Docker有一个更深入的了解，并在实际项目中应用Docker。
Docker 教程九 （Docker Dockerfile）
失心少年
10-15 853
Dockerfile 是一个文本文件，包含了构建 Docker 镜像的所有指令。Dockerfile 是一个用来构建镜像的文本文件，文本内容包含了一条条构建镜像所需的指令和说明。通过定义一系列命令和参数，Dockerfile 指导 Docker 构建一个自定义的镜像。
nodejs 实现docker 精简可视化控制
jjocwc的博客
10-18 86
使用react 和nodejs 实现的非常轻量的服务docker管理。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值