微信云托管(本地调试)⑥:nginx、vue刷新404问题

一、nginx默认路径

 

        1.1、默认配置文件路径:/etc/nginx/nginx.conf

        1.2、默认资源路径:/usr/share/nginx/html/index.html

二、修改nginx.conf配置

注意配置中的:include /etc/nginx/conf.d/*.conf;  里面包了一个server配置文件) 

user  nginx;
worker_processes  auto;
error_log  /var/log/nginx/error.log notice;
pid        /var/run/nginx.pid;
events {worker_connections  1024;
}http {include       /etc/nginx/mime.types;default_type  application/octet-stream;log_format  main  '$remote_addr - $remote_user [$time_local] "$request" ''$status $body_bytes_sent "$http_referer" ''"$http_user_agent" "$http_x_forwarded_for"';access_log  /var/log/nginx/access.log  main;sendfile        on;#tcp_nopush     on;keepalive_timeout  65;#gzip  on;#include /etc/nginx/conf.d/*.conf;server {listen       80;listen  [::]:80;server_name  localhost;#access_log  /var/log/nginx/host.access.log  main;location / {root   /usr/share/nginx/html; # vue目录地址(dist)index  index.html index.htm;try_files $uri $uri/ /index.html;  # 解决刷新页面变成404问题的代码}#error_page  404              /404.html;error_page   500 502 503 504  /50x.html;location = /50x.html {root   /usr/share/nginx/html;}}
}

三、dockerfile

COPY ./nginx.conf /etc/nginx/nginx.conf

COPY --from=nodeBuild /y-qd/dist /usr/share/nginx/html

# 二开推荐阅读[如何提高项目构建效率](https://developers.weixin.qq.com/miniprogram/dev/wxcloudrun/src/scene/build/speed.html)
# 选择构建用基础镜像。如需更换,请到[dockerhub官方仓库](https://hub.docker.com/_/java?tab=tags)自行选择后替换。# 引入Node.js
FROM node:12.22.12 AS nodeBuild# npm镜像,解决报错而引入
RUN npm config set registry https://registry.npm.taobao.org# install simple http server for serving static content
# 全局http-server用于本地运行
#RUN npm install -g http-server# make the 'app' folder the current working directory
# 指定构建过程中的工作目录
WORKDIR /y-qd# copy both 'package.json' and 'package-lock.json' (if available)
# 将src目录下所有文件,拷贝到工作目录中src目录下(.gitignore/.dockerignore中文件除外)
COPY package*.json ./# install project dependencies
RUN npm install# copy project files and folders to the current working directory (i.e. 'app' folder)
COPY . .# build app for production with minification
# 生产打包,对应脚本"build": "node build/build.js"
RUN npm run build
#本地,对应脚本"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js"
#RUN npm run dev# production stage
#代理nginx,nginx直接访问
FROM nginx:stable-alpine AS nginxBuild
COPY ./nginx.conf /etc/nginx/nginx.conf
COPY --from=nodeBuild /y-qd/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]#本地对应端口
#EXPOSE 8088
#CMD [ "http-server", "dist" ]

四、注意

4.1、

完~

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

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

相关文章

Unity制作护盾——1、闪电护盾

Unity引擎制作闪电护盾效果 大家好,我是阿赵。   这期做一个闪电护盾的效果。 一、效果说明 可以改变闪电的颜色 可以改变范围 改变贴图的平铺次数,也可以做出各种不同感觉的护盾。 二、原理 这个效果看着很复杂,其实只是用了一张N…

【excel密码】excel数据加密,如何设置?

Excel数据完成制作之后,想要保护工作表数据不被修改,我们可以对excel数据设置保护,确保数据的准确性。今天分享两种方法设置数据保护。 方法一:工作表/工作簿保护 这里的限制编辑被分为了两种方式,分别是保护工作表、…

Rpc原理

dubbo原理 1、RPC原理 一次完整的RPC调用流程(同步调用,异步另说)如下: 1)服务消费方(client)调用以本地调用方式调用服务; 2)client stub接收到调用后负责将方法、参数…

【快应用】list组件属性的运用指导

【关键词】 list、瀑布流、刷新、页面布局 【问题背景】 1、 页面部分内容需要瀑布流格式展示,在使用lsit列表组件设置columns进行多列渲染时,此时在里面加入刷新动画时,动画只占了list组件的一列,并没有完全占据一行宽度&…

科技感响应式管理系统后台登录页ui设计html模板

做了一个科技感的后台管理系统登录页设计,并且尝试用响应式布局把前端html写了出来,发现并没有现象中的那么容易,chrome等标准浏览器都显示的挺好,但IE11下面却出现了很多错位,兼容起来还是挺费劲的,真心不…

Linux下QtCreator勾选Use root user后出现error while loading shared libraries的问题

文章目录 背景解决办法其他解决办法 背景 在linux下调试程序时,有时候需要取得root权限才能连接操作某些设备。 之前我是通过脚本方式 [在QtCreator中先执行自定义命令再执行程序]来进行的。也就是在脚本中取得权限,脚本内容类似这样: echo…

如何维护你的电脑:打造IT人的重要武器

文章目录 方向一:介绍我的电脑方向二:介绍我的日常维护措施1. 定期清理和优化2. 保持良好的上网习惯和安全防护3. 合理安排软件和硬件的使用4. 数据备份和系统还原 方向三:推荐的维护技巧1. 数据分区和多系统安装2. 内部清洁和散热优化3. 安全…

鉴源论坛·观擎丨浅谈操作系统的适航符合性(下)

作者 | 蔡喁 上海控安可信软件创新研究院副院长 版块 | 鉴源论坛 观擎 社群 | 添加微信号“TICPShanghai”加入“上海控安51fusa安全社区” 在浅谈操作系统的适航符合性(上)中,详细介绍了民用飞机操作系统的研制现状及其适航要求&#xff…

服装行业多模态算法个性化产品定制方案 | 京东云技术团队

一、项目背景 AI赋能服装设计师,设计好看、好穿、好卖的服装 传统服装行业痛点 • 设计师无法准确捕捉市场趋势,抓住中国潮流 • 上新周期长,高库存滞销风险大 • 基本款居多,难以满足消费者个性化需求 解决方案 • GPT数据…

RunnerGo配置场景时接口模式该怎么选

在进行性能测试时,测试场景的正确配置非常关键。首先,需要根据业务场景和需求,设计出合理的测试场景,再利用相应的工具进行配置,实现自动化的性能测试。 在JMeter中,用户需要自己组织测试场景,…

加拿大量子研究新动作!D-Wave与滑铁卢大学合作研究量子相干性

​ (图片来源:网络) D-Wave是量子计算系统、软件和服务的领导者,也是量子计算机的第一家供应商。近期,D-Wave宣布与滑铁卢大学量子计算研究所(IQC)达成两项新合作。他们为量子计算系统建立了关键…

Redis性能瓶颈揭秘:如何优化大key问题?

1. 什么是Redis大key问题 Redis大key问题指的是某个key对应的value值所占的内存空间比较大,导致Redis的性能下降、内存不足、数据不均衡以及主从同步延迟等问题。 到底多大的数据量才算是大key? 没有固定的判别标准,通常认为字符串类型的k…

服务器中了malox勒索病毒后怎么办怎么解决,malox勒索病毒解密数据恢复

服务器遭受Malox勒索病毒攻击后,快速解密并恢复数据至关重要,以便减少更大的经济损失。近期,新的一波malox勒索病毒正在肆虐,我们收到很多企业的求助,企业的服务器数据库遭到了malox勒索病毒攻击,导致系统内…

Vue常见的事件修饰符

1.prevent:阻止默认事件(常用) 2. stop:阻止事件冒泡(常用) 3. once:事件只触发一次(常用) 4.captrue:使用事件的捕捉模式(不常用) 5.self:只有event.target是当前操作的元素时才触发事件(不常用) 6.passive:事件的默认行为立即执行,无需等待事件回调执行完毕(不常用…

CI/CD持续集成持续发布(jenkins)

1.背景 在实际开发中,我们经常要一边开发一边测试,当然这里说的测试并不是程序员对自己代码的单元测试,而是同组程序员将代码提交后,由测试人员测试; 或者前后端分离后,经常会修改接口,然后重新…

YOLOv5改进系列(19)——替换主干网络之Swin TransformerV1(参数量更小的ViT模型)

【YOLOv5改进系列】前期回顾: YOLOv5改进系列(0)——重要性能指标与训练结果评价及分析 YOLOv5改进系列(1)——添加SE注意力机制

Stable Diffusion教程(6) - 扩展安装

打开stable diffusion webUI界面 加载插件列表 依次点击扩展->可用->加载自 搜索插件 首先在搜索框输入你要安装的插件,然后点击插件后面的安装按钮 如果你需要的插件这里面没有找到,可通过通网址安装的方式安装。 在git仓库网址输入框输入的你插件…

el-table那些事

el-table那些事 获取el-table所有勾选的行数据 用于记录工作和日常学习遇到的坑,需求。 vue3element-plusts 获取el-table所有勾选的行数据 1、需要先声明一个ref变量,并赋值给el-table 2、通过el-table提供的getSelectionRows()函数获取选中的"行…

怎么修改ip地址 手机ip地址如何改

如今的数字化时代,IP地址是连接我们与互联网世界的桥梁。然而,有时我们可能需要修改IP地址以满足特定需求,比如提高网络速度、绕过地理限制等。本文将为您提供修改IP地址的简单步骤和常见问题解答,帮助您轻松完成IP地址修改。 一、…

ffmpeg下载安装教程

ffmpeg官网下载地址https://ffmpeg.org/download.html 这里以windows为例,鼠标悬浮到windows图标上,再点击 Windows builds from gyan.dev 或者直接打开 https://www.gyan.dev/ffmpeg/builds/ 下载根据个人需要下载对应版本 解压下载的文件,并复制bin所在目录 新打开一个命令…