windows系统docker中将vue项目网站部署在nginx上

一、首先在windows系统上下载并安装docker,要下载windows版本

https://www.docker.com/products/docker-desktop/

PS:安装过程中需要WSL,我的是win11系统,直接提示了我安装就可以下一步了。其他windows系统版本我不知道是否需要单独安装。

安装完成docker后运行效果如下(可以在官网注册账号):

二、接下来的步骤咱们尽量不用命令(因为是windows嘛,全部图形化操作),在docker这个应用程序中安装nginx

搜索nginx关键字,然后最好选择刀客团队发布的,最新版,更安全和稳定。如果没有可以选第三方发布的,用量比较大的。点击后面那个Pull,等待获取完成就算安装完了。

三、此时可以运行nginx镜像,生成一个应用容器了。

填写相关信息这里是个坑,如果你点击docker程序提供的选择路径按钮,将来运行会出错,提示找不到路径,所以得按如下的双斜杠形式填写:

1.宿主机default.conf路径  :

C:\\Users\\mingyong.huang\\Desktop\\local\\default.conf

2.nginx运行时路径(即 default.conf),这里不明白是什么意思,去查一下nginx使用方法,这个路径基本都是固定的:

/etc/nginx/conf.d/default.conf

3.宿主机网站文件路径(即:是你的vue项目被编译后的网站静态文件存放路径):

C:\\Users\\mingyong.huang\\Desktop\\www\\site1\\dist

4.nginx运行时路径(即 nginx运行网站的静态文件路径),也是固定的,同理,不懂去查一下nginx使用方法:

/usr/share/nginx/html

PS:至于网上有说什么nginx运行时还有个 /etc/nginx.conf需要配置,这次我没有用到也可以正常运行!此处咱们先不管它,等后期用到再说。

最后点击run按钮,大功告成!看下成果吧!

此时你就能看到生成的容器了,按照此方法,你想生成多少个容器都可以。是不是比虚拟机更轻量级,你还可以pull更多的应用,比如redis、mysql等等。

完美运行网站!

PS:vue项目如果用的history模式(而不是hash模式),直接F5刷新页面会报错404,解决办法就是在default.conf文件加一句话即可,try_files  $uri  $uri/  /index.html;

这个文件我是放在C:\\Users\\mingyong.huang\\Desktop\\local\\default.conf的嘛,所以打开后编辑保存,重启此容器即可。

server {listen       80;listen  [::]:80;server_name  localhost;#access_log  /var/log/nginx/host.access.log  main;location / {root   /usr/share/nginx/html;index  index.html index.htm;# 避免f5刷新后404..try_files  $uri  $uri/  /index.html;}#error_page  404              /404.html;# redirect server error pages to the static page /50x.html#error_page   500 502 503 504  /50x.html;location = /50x.html {root   /usr/share/nginx/html;}# proxy the PHP scripts to Apache listening on 127.0.0.1:80##location ~ \.php$ {#    proxy_pass   http://127.0.0.1;#}# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000##location ~ \.php$ {#    root           html;#    fastcgi_pass   127.0.0.1:9000;#    fastcgi_index  index.php;#    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;#    include        fastcgi_params;#}# deny access to .htaccess files, if Apache's document root# concurs with nginx's one##location ~ /\.ht {#    deny  all;#}
}

全部完毕!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/132877.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++下标运算符详解

C++ 规定,下标运算符[ ]必须以成员函数的形式进行重载。该重载函数在类中的声明格式如下: 返回值类型 & operator[ ] (参数); const 返回值类型 & operator[ ] (参数) const; 使用第一种声明方式,[ ]不仅可以访问元素,还可以修改元素。使用第二种声明方式,[ ]只…

postgresql-通用表达式

postgresql-通用表达式 入门案例简单CTE递归 CTE案例1案例2 入门案例 -- 通用表达式 with t(n) as (select 2) select * from t;简单CTE WITH cte_name (col1, col2, ...) AS (cte_query_definition ) sql_statement;WITH 表示定义 CTE,因此 CTE 也称为 WITH 查询…

河北省图书馆典藏《乡村振兴振兴战略下传统村落文化旅游设计》许少辉八一新著

河北省图书馆典藏《乡村振兴振兴战略下传统村落文化旅游设计》许少辉八一新著

Nginx(动静分离、分配缓冲区、资源缓存、防盗链、资源压缩、IP黑白名单、大文件传输配置、跨域配置、高可用、性能优化)

Nginx,负载均衡,Http反向代理服务器,支持大部分协议,如TCP、UDP、SMTP、HTTPS 环境搭建 Nginx反向代理-负载均衡 首先通过SpringBootFreemarker快速搭建一个WEB项目:springboot-web-nginx,然后在该项目中&…

FastJSON将对象转JSON字符串引发的血案

问题:最近工作中需要将一个将近两百页的pdf的base64作为value转成JSON字符串,而代码中使用的方案就是JSONObject.toJSONString(obj); 而结果就是引发了OOM内存溢出。 翻阅源码找到一段关键点: 也就是说FastJSON内部设置了一个阈值&#xff…

C++模版基础

代码地址 gitgithub.com:CHENLitterWhite/CPPWheel.git 专栏介绍 本专栏会持续更新关于STL中的一些概念,会先带大家补充一些基本的概念,再慢慢去阅读STL源码中的需要用到的一些思想,有了一些基础之后,再手写一些STL代码。 (如果你…

深入了解MySQL中的JSON_ARRAYAGG和JSON_OBJECT函数

在MySQL数据库中,JSON格式的数据处理已经变得越来越常见。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它可以用来存储和表示结构化的数据。MySQL提供了一些功能强大的JSON函数,其中两个关键的函数是…

奶牛个体识别 奶牛身份识别

融合YOLOv5s与通道剪枝算法的奶牛轻量化个体识别方法 Light-weight recognition network for dairy cows based on the fusion of YOLOv5s and channel pruning algorithm 论文链接 知网链接 DOI链接 该文章讨论了奶牛花斑、光照条件、不同剪枝方法、不同剪枝率对准确率的影响…

类和对象(3)

文章目录 1.回顾上节2. 拷贝构造3. 运算符重载(非常重要)4. 赋值运算符重载 1.回顾上节 默认成员函数:我们不写,编译器自动生成。我们不写,编译器不会自动生成 默认生成构造和析构: 对于内置类型不做处理对…

PMP-项目规划过程组的重要性

一、什么是项目规划过程组 规划过程组包括明确项目全部范围、定义和优化目标,并为实现目标制定行动方案的一组过程。规划过程组中的过程制定项目管理计划的组成部分,以及用于执行项目的项目文件。取决于项目本身的性质,可能需要通过多轮反馈来…

使用阿里PAI DSW部署Stable Diffusion WebUI

进入到网址https://pai.console.aliyun.com/里边。 点击创建实例。 把实例名称填写好,选择GPU规格,然后选择实例名称是ecs.gn6v-c8g1.2xlarge。 选择stable-diffusion-webui-env:pytorch1.13-gpu-py310-cu117-ubuntu22.04,然后点击下一步。…

Python+requests编写的自动化测试项目

框架产生目的:公司走的是敏捷开发模式,编写这种框架是为了能够满足当前这种发展模式,用于前后端联调之前(后端开发完接口,前端还没有将业务处理完毕的时候)以及日后回归阶段,方便为自己腾出学(m…

C++之保存编译全部中间文件(二百一十五)

简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 优质专栏:Audio工程师进阶系列【原创干货持续更新中……】🚀 人生格言: 人生…

【持续记录】深度学习环境配置

1080面对Transformer连勉强也算不上了,还是要去用小组公用的卡 完整记一个环境配置,方便后面自用✍️ nvidia-smi查看GPU信息 ** CUDA版本12.2 conda -V查询conda版本 22.9.0 新建conda环境 准备装python3.8 conda create --name caiman python3.8.2激…

04-JVM对象创建深度剖析

上一篇:03-JVM内存模型剖析与优化 对象创建的主要流程: 1.类加载检查 虚拟机遇到一条new指令时,首先将去检查这个指令的参数是否能在常量池中定位到一个类的符号引用,并且检查这个符号引用代表的类是否已被加载、解析和初始化过。如果没有…

ppt录制在哪?实用技巧分享!

在现代演示和培训中,PPT演示已经成为越来越流行的一种交流方式。而录制ppt也成为了很多商务演讲、教学讲解、产品演示等场合的必备技能。本文将为您介绍两种常见的ppt录制方式,帮助您轻松录制ppt演示的过程。 ppt录制在哪? ppt是一款流行的演…

【扩散模型】4、Improved DDPM | 引入可学习方差和余弦加噪机制来提升 DDPM

文章目录 一、背景二、Improved DDPM——提升 Log-likelihood2.1 可学习的方差2.2 改进 noise schedule2.3 降低梯度噪声 三、效果 论文:Improved Denoising Diffusion Probabilistic Models 代码:https://link.zhihu.com/?targethttps%3A//github.com…

【ELK】日志分析系统概述及部署(ELFK部署实验)

目录 一、ELK概述 1、ELK是什么? 2、ELK的组成部分 2.1 ElasticSearch (1)分片和副本 (2)es和传统数据库的区别 2.2 Kiabana 2.3 Logstash (1)Log Stash主要组件 2.4 可添加的其它组件…

YOLO DNF辅助教程完结

课程完结!撒花、撒花、撒花 课程完结!撒花、撒花、撒花 课程完结!撒花、撒花、撒花 ​呕心沥血三个月,《利用人工智能做DNF游戏辅助》系列实战课程已完结,技术路线贯穿串口通信、目标检测、opencv特征匹配等前沿技术…

黑马JVM总结(八)

(1)StringTable面试题 1.8 1.6时 (2)StringTable的位置 jvm1.6时StringTable是常量池的一部分,它随着常量池存储在永久代当中,在1.7、1.8中从永久代变成了堆中,为什么做这个更改呢&#xff1f…