一.前端路由介绍: 路由就是指随着浏览器地址栏的变化，展示给用户的页面也不相同。 传统的网页根据用户访问的不同的地址，浏览器从服务器获取对应页面的内容展示给用户。这样造成服务器压力比较大，而且用户访问速度也比较慢
vue开发的项目，通过编译会得到 dist文件夹，如何发布到nginx服务器上？1 配置nginx服务器在nginx服务文件中，打开 conf文件夹，如下为了不改变nginx的默认配置（nginx.conf），复制一份，重名为 custom.conf，如下修改 custom.conf 文件中的 root 参数为 dist，如下......
server {
listen
转载
2024-05-18 20:52:00
424阅读
最近有段时间没搞项目部署了，结果在部署前端项目的时候，访问页面路由（不是根路径），nginx 响应都是 404，直接访问页面根路径，路由跳转到前端的 404 页面，排查了半天，这里再总结一下。1. 路由访问 404 问题前端单页应用路由分两种：哈希模式和历史模式。哈希模式部署不会遇到啥问题，但是一般只用于本地调试，没人直接部署到生产环境。历史模式的路由跳转通过 pushState 和 replac
转载
2024-03-26 20:51:37
685阅读
在本次使用nginx发布vue项目遇到 配置location 始终404 和 在项目子目录点击浏览器刷新出现404问题使用nginx发布vue项目，为了方便测试就下载了一个nginx 放置自己目录下nginx目录是这样的一、配置端口然后打开conf / nginx.conf 配置 server，首选监听808 设置服务名listen 808;
server_name localho
转载
2024-06-19 20:40:24
205阅读
在本次使用nginx发布vue项目遇到 配置location 始终404 和 在项目子目录点击浏览器刷新出现404问题使用nginx发布vue项目，为了方便测试就下载了一个nginx 放置自己目录下nginx目录是这样的一、配置端口然后打开conf / nginx.conf 配置 server，首选监听808 设置服务名listen 808; server_name localho
一、基础开发工具1、安装nodejs软件。http://nodejs.cn/download/2、安装git软件，代替命令行工具。https://git-scm.com/downloads 注：* 如何解决Git Bash 面板中的中文乱码问题？右键->options->text->把编码格式改为UTF-8。3、全局安装nodemonnpm install nodemon -g4
Vue Router 路由实现原理 一、概念 通过改变 URL，在不重新请求页面的情况下，更新页面视图。 二、实现方式 更新视图但不重新请求页面，是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要有2种方式： 1.Hash --- 利用 URL 中的hash("#"); 2.利用 History interface 在H
history模式的配置方法我们来看看官方文档是教我们怎么配置的：HTML5 History 模式。首先要将mode设置为 history：const router = new VueRouter({
mode: 'history',
routes: [...]
})nginxlocation / {
try_files $uri $uri/ /index.html;
}&n
转载
2024-04-26 16:42:40
142阅读
部署准备vue项目打包 首先打开public下的index目录，修改后台的URL地址，如下图所示：使用CMD，打开命令行程序。进入项目根目录。执行命令：npm run build，完成打包。在根目录输出结果如下： 如果在一个nginx的同一个端口号下配置多个vue应用，则需要在第二个应用开始，按照以下步骤修改，再执行打包程序。 第一步：修改根目录下的vue.config.js的publicPath
转载
2023-12-02 13:26:16
193阅读
介绍# vue在国内的前端地位可谓是如日中天，由于目前主流的前后端分离式开发，让许多前端小伙伴不太了解服务器操作特别是Linux，而许多后台开发人员虽然精通服务器，却不懂前端框架如何发布。本篇将详细介绍vue构建静态文件发布至Linux并配置Nginx服务代理https，在发布前我们先需要准备以下环
转载
2021-01-29 09:26:00
698阅读
2评论
1、Jenkins简介Jenkins是开源CI&CD软件领导者， 提供超过1000个插件来支持构建、部署、自动化， 满足任何项目的需要。2、Jenkins安装这里是使用docker-compose安装Jenkins，所以需要先安装docker和docker-compose2.1、docker安装在安装前检查是否有安装gcc和gcc-c++
安装软件包
yum install -y yum
转载
2024-10-28 21:51:01
125阅读
SpringBoot、Vue、Nginx 配置这边只对后端和nginx 做了配置，发现前端似乎不需要nginx# 一定要将 nobody 改为当前用户，比如我当前用户为 root
user root;
worker_processes 1;
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log
一、Vue3.x中的路由路由可以让应用程序根据用户输入的不同地址动态挂载不同的组件。Vue Routernpm install vue-router@next --savenpm install vue-router@4二、Vue3.x路由的基本配置1、安装路由模块npm install vue-router@next --save2、新建组件src/views/Home.vue<temp
前端路由路由器的功能：在数据通信时帮你选择通信的路线 在vue中的路由，能够帮助我们在一个vue组件中实现其他组件的相互切换。 也就是说，可以通过路由模块，将制定的组件显示在路由视图中。安装路由模块npm install vue-router -s设计路由界面创建静态路由表 在src中创建router.jsimport Home from './views/Home'
import produce
转载
2024-04-02 07:24:32
354阅读
在Kubernetes(K8S)中部署Vue前端应用并配置nginx是一个常见的操作，本文将教你如何完成这个过程。首先，让我们来了解整个流程，然后详细说明每个步骤需要做什么。
### 流程概述
在K8S中部署Vue前端应用并配置nginx的流程如下：
| 步骤 | 描述 |
| ---- | ---- |
| 步骤一 | 创建Vue前端应用Docker镜像 |
| 步骤二 | 编写nginx
原创
2024-05-22 09:59:07
199阅读
问题的原因：项目本来使用 hash 的路由模式来部署，因为需求关系，现在要改成 history 的模式来部署了（路径上不要有 # 号） 第一步： 修改项目的 router/index.js 的配置const router = new VueRouter({
mode: 'history', // 将 hash 改成 history
routes: [
...pages
]
}
转载
2024-04-07 13:51:09
198阅读
对于前后端分离的项目，前端项目和后端项目需要单独部署，通常会使用SpringBoot框架开发后端项目，使用Vue框架开发前端项目；后端项目的部署较为简单，一般来说就是先打成一个Jar包上传到服务器，然后使用 nohup java -jar Jar包名 & 命令启动项目即可；完整部署流程可参考文章： 而对于前端Vue项目的部署，需要使用Nginx做反向代理，原因是开发的时候我们使用的是web
转载
2024-01-08 17:47:33
62阅读
有个 vue 项目，打算放到 jenkins 上编译，顺便加上 webhook 提交代码后自动编译发布到对应的远程服务器 nginx 下。jenkins 触发代码提交后自动构建请看这里: jenkins之webbook一、配置 jenkins系统管理 -> 全局工具配置 安装 nodejs 模块二、编写 jenkins 执行脚本第一步：首先需要初始化 nodejs 环境下面是初始化
转载
2024-06-09 06:10:08
129阅读
1、安装好nginx后启动2、将前端项目复制到/nginx/html文件夹下 3、将nginx下的配置文件（/nginx/conf/nginx.conf）里的serve
原创
2022-06-21 20:09:46
534阅读
#user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/nginx.pid; events { worker_connections ...
转载
2019-08-03 11:35:00
333阅读
2评论
