docker部署vue项目详解 dockerfile+vue+nginx 有关vue部署到服务器 终结篇

作者:神秘网友 发布时间:2021-02-01 14:20:07

docker部署vue项目详解 dockerfile+vue+nginx 有关vue部署到服务器 终结篇

使用docker部署vue项目

前置知识

为什么使用dockerfile和nginx参考 https://blog.csdn.net/weixin_44598727/article/details/108269718

文件准备

default.conf

参考 https://blog.csdn.net/fuck487/article/details/103100014

但注意有两个地方要更改

Dockerfile

# 设置基础镜像
FROM nginx
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/  /usr/share/nginx/html/
# 用本地的 default.conf 配置来替换nginx镜像里的默认配置
COPY default.conf /etc/nginx/conf.d/default.conf

linux控制台内执行

# 进入自建文件夹
cd /home/xjs/testvue/
# 构建镜像,版本为6.0,自己定
docker build -t testvue:6.0 .
# 运行镜像为容器,这里注意服务器要更改安全策略,如开启9090端口
docker run -d -p 9090:80 --name testvue testvue:6.0

参考

Docker简单粗暴的部署Vue项目详解 https://blog.csdn.net/weixin_44598727/article/details/108269718

dockerfile部署vue项目 https://blog.csdn.net/fuck487/article/details/103100014

docker--部署vue项目 https://www.cnblogs.com/zouzou-busy/p/11838524.html

到此为止已经结束,这里分享过程中很可能用到的linux语句

彻底删除镜像

docker ps
#停止容器
docker stop 容器ID
#卸载容器
docker rm 容器ID

docker images
#删除镜像
docker rmi -f 镜像ID

查看容器内nginx配置

# 进入前面建好的容器
docker exec -it 容器ID bash
# 容器内部执行,进入项目文件存放位置
cd /usr/share/nginx/html/
# 容器内部执行,查看nginx配置是否正确
more /etc/nginx/conf.d/default.conf

docker部署vue项目详解 dockerfile+vue+nginx 有关vue部署到服务器 终结篇 相关文章

  1. Docker镜像与容器的常用操作

    Docker镜像加速配置;Docker镜像常用操作;Dcoker容器常用操作。 镜像加速器 国内从 Docker Hub 拉取镜像有时会遇到困难,此时可以配置镜像加速器。国内很多云服务商都提供了国内加速器服务,例如: 1 网易云加速器 https://hub-mirror.c.163.com2 阿里云加

  2. Docker 安装及常用命令

    1:docker安装 卸载原来的docker yum remove docker \ docker-client \ docker-client-latest \ docker-common \ docker-latest \ docker-latest-logrotate \ docker-logrotate \ docker-engine 安装需要的安装包 yum install -y yum-utils 配置镜像 国外的

  3. Docker本地仓库清理

    delete-docker-registry-image Install curl https://raw.githubusercontent.com/burnettk/delete-docker-registry-image/master/delete_docker_registry_image.py | sudo tee /usr/local/bin/delete_docker_registry_image /dev/nullsudo chmod a+x /usr/lo

  4. Vue移动端左右滑动组件

    一个业务问题 由于加载的数据过大 之前用Swiper组件一次性加载所有 导致安卓低端手机及苹果内核性能低下导致闪退 监听用户左右滑动触发事件,按自己业务逻辑写对应代码 可以自定义触发距离 上下滑防误触 template div class="slide" ref='slide' @touchstart=

  5. springmvc零配置创建与简单部署

    Spring MVC 零配置项目简单实现 一、创建Spring MVC Web?程 ??创建 Maven 的 web 项? 二、pom.xml 导入依赖 !-- spring web --dependencygroupIdorg.springframework/groupIdartifactIdspring-web/artifactIdversion5.2.8.RELEASE/version/dependency!-- spr

  6. 使用nodejs编写api接口并部署到服务器上

    一、用node.js编写api接口 1、安装node环境,没有就去下载nodejs, 下载地址2、创建一个node项目, 新建一个目录文件,例node_proxy3、在新建的node项目执行npm init, 文件会生成一个package.json的文件4、安装express框架, 及相关依赖。 npm install express

  7. Docker 两个不同网络间实现连通

    一、启动不同网络的容器 1、启动两个bridge(自带默认)桥接的容器 [root@yang ~]# docker run -it --name tomcat1 tomcat [root@yang ~]# docker run -it --name tomcat2 tomcat # 查看容器 [root@yang ~]# docker ps -aCONTAINER ID IMAGE COMMAND CREATED

  8. Vue(二)-- 计算属性,监视

    目录 计算属性 --1.1回调函数复习 --1.2计算高级属性 2.监视 计算属性 注意 :里面的this都是代表vue实例(vm对象) 在computed属性对象中定义计算属性的方法 在页面中使用{{方法名}}来显示计算的结果 计算属性中的方法的返回值将作为属性值显示 bodydiv id="

  9. springboot+Jenkins+docker-compose自动部署项目实践

    DevOps思想 一个开发、测试、运维的整个过程的思想。 plan:需求、计划 code:编码 build:构建 test: 测试 release:发布版本 deploy:部署 operate:项目运转 monitor:监控 Jenkins主要做自动部署的工作。 准备一个简单的springboot项目,并用码云管理代码

  10. vue动态创建组件

    el-tabs v-model="activeName" @tab-click="handleClick" el-tab-pane v-for="item in elTabPaneList" :key="item.name" :name="item.name" :label="item.label" component :is="item.name" :key="item.name" v-if="activeName === item.name"/component /el

每天更新java,php,javaScript,go,python,nodejs,vue,android,mysql等相关技术教程,教程由网友分享而来,欢迎大家分享IT技术教程到本站,帮助自己同时也帮助他人!

Copyright 2020, All Rights Reserved. Powered by 跳墙网(www.tqwba.com)|网站地图|关键词