Vue-cli3.0相比于Vue-cli2.0,仅从根目录来看,最大的区别就是Vue-cli3.0少了build和config文件夹,前者用于项目构建(webpack)相关代码,后者用于项目开发环境配置。取而代之的是vue.config.js这个文件,看起来目录简洁不少。 图1 vue-cli3.0根目录打开vue.config.js文件,大致的配置如下:module.exports
nginx的反向代理:代理机location /{里面注释全部东西,然后写 proxy_pass http://必须要写http://10.12;}代理到10.12,就是curl 代理机的时候会curl到10.12 图片分离:在location下面再写一个匹配的location ~\.(jpg|png|gif|jpeg)${proxy_pass http://10.14;}现在在10.14的网站目
本文主要记录如何配置vue的打包文件配置项,使打包后的文件可以支持二级目录的访问。1、常规打包在实际的项目中,我们通常都使用 npm run build 直接打包文件后丢到服务器上访问打包后的文件目录是这样的:访问的静态资源都是地址是这样的:我们现在要放在服务器的二级目录下访问地址,那么访问的路径就应该也加上二级目录,该如何配置尼?2、静态文件地址修改静态文件的访问地址应该加上二级目录前缀:方法:
转载
2024-02-18 13:30:09
958阅读
./configure6、编译和安装如果/usr/local下出现nginx目录,表示安装成功make && make install7、使用启动cd /usr/local/nginx/sbin/./nginx其他命令./nginx -s stop 停止./nginx -s quit 退出./nginx -s reload 重启8、打开80端口firewall-cmd --zone
本文将描述遇到的问题,并给出解决方案一、遇到的问题使用history模式,本地没有问题。打包部署再nginx上会报错404,找不到页面。部署二级域名或者说多级访问的url,导致访问失败。(EG:http://www.baidu.com/baiduwangpan/aaaa)二、解决方案1、解决使用history模式,本地没有问题。打包部署再nginx上会报错404,找不到页面。由于本文重点介绍如何实
转载
2024-10-12 20:00:24
275阅读
vuex mutation action getter 辅助函数
一、vue-router——路由管理 经过自己的学习加项目总结,针对路由这块内容说下自己的理解:路由配置主要有三个关键字:route routes routerroute(单数)表示一条路由,它是一个对象由两部分构成(path——路径;component——组件)例如:homeB
嵌套(多级)路由一级路由{
//第一组路由规则
path:'/about',
component:About
}要实现二级路由得把规则写在一级路由里面既然是一级路由的下一级路由(子路由);得写一个特殊的配置项:children(孩子们):....
import Home from '../pages/Home.vue'
import News from '../pages/
vue-router的路由模式可以通过指定mode属性值控制,可选值:"hash" 、"history"、 "abstract" , 默认:"hash" (浏览器环境) , "abstract" (Node.js 环境)const router = new VueRouter({
mode: 'history',
routes: [...]
})路由表里的兜底配置hash与historyH
转载
2024-07-22 17:23:23
432阅读
环境介绍这次软工团队作业是写一个学习用的交流(聊天)软件。而我负责管理端的编写。工作范围从数据库到前后端。采用的技术栈为vue-cli+express+nginx。本地环境为win10,服务器为华为云Ubuntu。在代码编写部分并未遇到太大的问题,然而在部署到服务器上时,发现前后端无法交互。网上随处可见部署过程中的技术细节。但却缺少对部署这项工作的总体介绍。对萌新或者着急肝工程的人很不友好。部署就
转载
2024-07-24 10:01:15
284阅读
第一个项目终于完结撒花,虽然只是跟着视频敲的,但也让我学到不少的知识。我在此总结一下,以防以后不时之需。若有大佬发现本文有错误的地方,还望留言指正。 文章目录配置2级路由封装网络请求组件调用 配置2级路由1.在router文件夹下的index.js中导入所需要的组件。 2.在下方配置路由和组件的对应关系。 3.在留有的组件关系下,与path,component同级创 建children,并在里面写
转载
2024-04-15 18:21:24
256阅读
简述:最近网站被恶意攻击,首先在服务器安装了云锁,安装云锁的步骤在博文“Linux服务器安装云锁”中,有需要的大家可以看一下;随后在又安装了Nginx防火墙,长下面这个样子: 在网站做了防护之后,发现移动端的静态文件全部404,不过也有可能是更早然后出现了问题.....问题描述:(1)数据接口请求正常,也能正常返回数据;(2)访问移动端首页,返回"We're sorry but blog
转载
2024-04-29 21:37:54
50阅读
一、修改router.js中添加base根目录配置const vueRouter = new Router({ mode: '
原创
2023-05-11 10:58:09
1451阅读
在上篇已经讲述了脚手架的安装,这篇就深入的理解的脚手架给我带来的方便吧! 首先我们看一下vue组件的结构,看这张图,会发现vue文件中无非就是html,js和css的结合。 我们再来了解一下脚手架中文件的用途: 在里面我已经加上了注释: 终于要进入正题了!!!!脚手架的一级路由和二级路由的使用:1.一级路由:(1).在componen
nginx配置后实现功能如下: 0. 打印访问日志请求设置不同域名/子域名的转发定制不同域名/子域名的打印访问请求日志实现某个域名下多台服务器的负载均衡配置 以下通过设置域名www.hellosr.com、daxin.hellosr.com为例进行配置说明对应的nginx的访问请求日志为:www.hellosr.com.access.log、dax
转载
2024-05-17 20:07:04
0阅读
proxy_cache_path语法:proxy_cache_path path [levels=number] keys_zone=zone_name:zone_size [inactive=time] [max_size=size]默认值:None 使用字段:http 指令指定缓存的路径和一些其他参数,缓存的数据存储在文件中,并且使用代理url的哈希值作为关键字与文件名
转载
2024-06-26 13:14:17
59阅读
Nginx部署vue项目进行跳转二级路由报404无法找到目标页面问题和Nginx部署vue项目访问不了接口 文章目录Nginx部署vue项目进行跳转二级路由报404无法找到目标页面问题和Nginx部署vue项目访问不了接口Nginx部署vue项目进行跳转二级路由报404无法找到目标页面问题**问题** :在使用Nginx部署Vue项目的时候,点击了进行跳转二级路由的时候报404 无法找到目标页面问
转载
2024-03-25 04:25:34
150阅读
解决跨域:开发环境中配置的跨域在将项目打包为静态文件时是没有用的 ,需要用 nginx 通过反向代理的方式解决这个问题# 工作模式与连接数上限
events {
...
}
# 设定http服务器
http {
...
server {
listen 8080; # 默认端口是 80,如果端口没被占用可以不用修改
se
转载
2024-05-08 08:29:49
3174阅读
项目中使用vue的时候一定会用到路由,并且二级路由甚至三级路由的需求都是刚需的,当然,多级路由配置方法和二级路由的是一样的,简单讲讲二级路由的配置。第一步:安装路由生态yarn add vue-router (也可以用npm)第二步:配置一级路由一、src静态文件夹下新建router文件夹并在其里面新建一个index.js文件,引入vue-router// 1、引入vue-router和vue
i
1、vue.config.jsmodule.exports = { publicPath: '/rm/',2、路由下index.jsconst ro
原创
2022-11-17 00:27:03
1208阅读
当网站设置了二级目录时,前端需要注意,可以有不同的解决方案防止白屏。设置带有二级目录的绝对路径,publicPath: '/test/',这样打包出来的静态资源可以和当前网站的配置保持一致,可以避免资源加载失败。设置相对路径,publicPath: './'。但是这样一来,如果此时使用的是 history 模式的路由配置,因为网站加了二级目录会导致前端的路由地址匹配失败,所以还需要将 router
原创
2022-09-13 10:47:37
1141阅读