- 博客(68)
- 收藏
- 关注
RSS订阅原创 Vue 项目build打包发布到giteepages ,首页正常显示，其他路由页面报错404的解决方法
一般这样就可以开始部署了，然后开启giteepages服务。如果出现了首页正常显示，其他页面显示404，那么需要在dist里面添加一个404.html文件，如下图。打包之后dist上传之后，还要新创一个.spa文件，注意！是 .spa 有个. 点，如下图。然后重新部署，重新查看页面（有时候没变化可能是缓存问题），一般就正常显示了。404.html内容和上图index.html内容一样，没错，就是一样。
2024-04-11 13:44:14
345
原创 Tauri fetch 网易云api 部分接口需要携带cookie
我在学习tauri配合网易云音乐过程中，发现我已经二维码登录了之后，调用一些需要登录的接口发现还是显示要我登录{code:'301',message:'需要登录'}。这里我直接用调用用户喜欢的音乐列表为localhost:3000/likelist?uid={你的用户id},后面发现是tauri携带cookie参数要放到query里面去参考代码如下。
2023-07-21 14:46:02
707
转载 Vue打包的项目部署服务器之后，其他路由刷新页面时显示404
有的朋友就会有疑虑，为什么在vue项目开发的时候不会出现这种问题呢？因为在vue项目开发的时候是访问自己的8080服务器,后端有进行处理，在刷新界面后找不到相对路径时，会重新渲染index.html界面，把路由的控制权交给前端，然后前端负责路由的匹配，在找到符合/test/123 这种格式的路由后,就会匹配成功。vue router mode 默认为hsas，这样的url中会带有#，如果改成mode:'history'就能去掉#号，也可以正常访问，但是再次率先你页面就会出现404。
2023-06-16 19:49:04
2580
原创 Vue禁止键盘使用ctrl+功能
在全局或者固定页面禁止使用（ctrl+R这个是tauri刷新页面功能）或者ctrl+?在onMounted。事件里面添加下面代码。
2023-02-18 17:54:26
1046
1
原创 vue项目部署到Gitee Pages,接口出现403处理
如果是有自己的服务器，放自己网站上，可直接用axios部署就行，就可跳过api、untils这2个文件夹的操作。上面代码是引入刚才创建的untils文件夹里面的文件，untils里面的文件如下，可以直接复制。这样设置后，接口就设置完成了，接下来设置vue.config.js（项目没有就自己创建）vue.config.js设置好就进行打包,部署到gitee上就能正常使用了，vue.config.js里面设置部署gitee仓库。api文件夹里面的user.js文件内容。base.js 请求接口。
2022-12-30 15:33:35
932
转载 Tauri 应用篇 - 系统托盘
在 Linux 上，则需要安装软件包对其进行支持，从官方文档了解 Linux 设置[2]。是一个布尔值，用于确定图像是否表示 macOS 上的模板图像[1]（为。方法，用于返回系统托盘的句柄，可以用来更新托盘图标和上下文菜单项。注意：只创建菜单项，而不添加事件处理，点击菜单依然会无响应。注意：点击托盘图标无响应，是因为并未对其添加菜单和事件。- 使用给定的标题和菜单项创建一个新的子菜单。注意：虽然应用菜单和托盘菜单都是菜单，但除。- 原生菜单项，目前仅支持菜单分割符。- 将自定义菜单项添加到系统托盘菜单。
2022-12-20 17:54:28
1455
原创 Tauri+Element-plus修改组件样式（局部样式和全局样式）
在Vue2.x版本中，我修改element-ui组件样式用的是 >>> 来修改。这里记录下在Vue3cli中使用Element-plus,并修改组件样式用的是。这里的scoped表示这个页面的样式不会和（污染）其他页面的样式冲突。
2022-12-11 11:07:43
654
原创 Tauri 打开新窗口
因为tauri运行就开始加载所以窗口，我们的新窗口要通过点击才能打开，所以给test窗口添加visible：false 创建这个窗口并且隐藏test窗口（不激活test窗口）。每个窗口都有一个label标题，第一个窗口有默认label不需要自己设置。这种方法不需要在tauri.conf.json里面配置要打开的窗口配置，直接在前端调用创建窗口方法。在tauri.conf.json里面找到windows,在里面添加要打开新窗口的配置。第一个是主窗口,第二个是我们要创建的新窗口test页面。
2022-11-19 15:33:35
2385
1
原创 Tauri 打包
2022/11/3 样式丢失解决了，在阿里巴巴图标库下载的图标最好是用svg，我是暂时用这个打包之后显示正常。然后放在路径C盘/用户/当前账户/AppData/Local/tauri/WixTools。我们需要在tauri.conf.json里面查找identifier这个名称。说下其他的，Tauri感觉确实比electron的内存占用小，好用23333。我们就单独去下载这个包，就是在图中的Downloading网址，去下载下来。这里右上角最小化按钮和关闭按钮样式丢失了，原因在查找中····。
2022-11-19 15:30:55
1609
7
转载 Tauri 处理post、get接口
本文源地址： TAURI的http请求调用示例 - 简书 (jianshu.com)在文件中进行配置，配置代码示例如下：如上所示，将http的scope字段配置为这样，就可以调用任意的服务器地址的接口服务，杜绝了跨域问题。不过如果只有单一的服务器地址提供接口服务，根据官网的文档配置为相对的服务器路径就行。二、http不同请求类型的调用示例：1、常规的Get请求示例：2、常规的Post请求示例：
2022-11-19 15:26:03
1360
原创 Tauri 引入element-plus
(注意)：element-plus在这里好像只能用ts引入才有效果，好像是element-plus只支持ts引入，用js引入会没有效果。效果图(switch按钮是element-plus的组件)element.vue代码。
2022-11-19 15:23:20
1822
原创 vue项目怎么在手机查看
可能，我们连接同一个网络以后，在手机浏览器输入第二个网址，发现手机端还是不能访问服务。这时候我们把电脑的防火墙关闭一下就好了。一个是本地的，一个是网络的。在手机浏览器地址栏输入第二个网址（这个时候再重新用手机查看vue项目第二个网址，就可以查看项目。【注意】：我们的手机和开启服务的电脑要连入同一个网络。然后点击 公用网络，然后 关闭防火墙。启动一个项目之后，会出现两个网址，），我们可以在手机端查看我们的。选择-windows防火墙。点击电脑左下角的【设置】
2022-09-24 18:33:46
3915
原创 electron 创建圆角窗口附带阴影效果
因为electron创建的主窗口既不能倒圆角，也无法添加阴影，我曾经想从这里突破，查看BrowserWindow属性文档后发现没有这些属性。所以要想有圆角，BrowserWindow的主窗口就必须消失，设置transparent: true，即主窗口透明，不让它碍事。backgroundColor: '#00000000',背景色也需要透明。然后frame: false，先得无边框才能有圆角。这两项是必须的，圆角只能通过操作CSS才能得到。
2022-09-07 20:07:57
4868
5
原创 electron窗口页面使用css drag拖动后，鼠标右键会弹出系统菜单，怎么让它隐藏？
在background.js里面添加下面代码。background.js全部代码。
2022-08-23 14:33:06
1175
1
原创 electron 使用模态窗口（即子窗口关闭前父窗口不能获取焦点）
1、在这里之前遇见了一个坑,关闭子窗口会报错。可能是子窗口用const来定义。在主进程里面添加下面代码。
2022-08-23 14:32:00
1398
原创 electron 打包问题
不想被拖动的地方添加css样式（如果登录页面使用了上面的代码，那么登录表单需要使用这个，不然会不会无法点击）解决方法：在想要拖动的地方添加css样式（登录页面顶部需要用到这个）（1）electron使用element组件图标样式丢失。（2）electron打包之后，页面无法拖动。...
2022-08-15 18:56:51
785
8
原创 vue-socket.io
这时候服务端触发 socket.emit(‘news’, data)第一个参数就是给到客户端的名称，第二个就是上一个函数收到的结果，这里是原封不动返回出去，到了客户端里面再sockets这个对象里面就可以写上’new’的函数来接收，参数就是服务器给我们的数据，这里直接打印在控制台。监听是否有人连接，如果客户端有人连接了就会触发回调，注意：io.emit是群发，类似聊天群发送信息。这里写了一些跨域的配置，监听的端口号为。在 vue2.x 项目里安装。在main.js里面引入添加。就会收到一些所需的事件触发。.
2022-08-15 18:55:58
851
原创 electron vue 模仿qq登录界面
里面的resetMessage信息提示是我重新封装的element组件（我就不放上去了）因为electron12版本开始就废除了remote模块，我们需要自己安装。background.js里面有默认的配置，修改后我的配置大概如下。里面的最小化图标、关闭图标、最大化图标 请自己去。里面的最小化图标、关闭图标、最大化图标 请自己去。能在客户端实现 最大化、最小化、关闭功能。1、Login.vue页面（登录页面）3、Login_form.vue组件。5、package.json文件。...
2022-08-15 18:54:23
1663
6
原创 electron属性
之后，会有一个background.js文件,里面有下面这些属性（部分，还有一些建议去官方查看）vue项目添加使用electron打包工具。
2022-08-15 18:50:08
1408
原创 访问GitHub官网显示不是专属连接,403等问题
这时候我们发现域名解析指向了本地，起因可能是电信经营商 DNS 污染（域名指往不正确的IP地址）？，而后利用管理员身份打开文本文件编辑，把上图解析的ip地址增加到hosts文件就可访问。例如我们访问不了xrwben.github.io这个地址，那么我们这种方法如何做？第二步：打开hosts文件增加解析，找到hosts文件在。配置完了最好再刷新一下DNS。第一步：首先利用工具。然后就可以正常访问了。...
2022-08-15 18:49:16
1019
原创 Vue使用electron创建桌面程序
问题1解决后，继续执行 打包， 可能会出现了一个新的问题，还是依赖包相关问题。13行的background.js文件在 src目录下（没有就自己创建一个）这个时候，我们手动把相关依赖包下载到本地，并且放到指定文件夹即可。在win-unpacked有个exe结尾的文件可以直接执行查看。上面，由于网络原因，不能够正常下载访问，所以影响打包操作。这里忘了说，隐藏菜单栏需要修改下配置文件内容，下次说；再继续遇见这样的，参考按前面2个方法解决看看。打包可能会出错，比如出现下图这些问题。这个问题是相关依赖包是在。...
2022-08-15 18:46:56
1422
原创 Vue前端配合fastadmin后端部署单域名设置
1、首先网站宝塔上搭建好网站，因为是单域名，所以需要把vue前端文件拉到public文件2、宝塔上面需要配置入口文件，这样域名默认域名就访问到了前端页面3、nginx配置，以下是我的配置，通过rewrite可以把vue前端图片以及后端还有接口进行转发location / { try_files $uri $uri/ /dist/index.html;}location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)${ if (!-e $requ.
2022-05-11 19:00:36
1520
原创 Nuxt判断手机端还是电脑端
nuxt.js 同一路由pc和移动端（1） 在pages下创建文件夹index（2） 在index文件夹下创建三个文件 index.vue 、 indexPc.vue 、 indexMobile.vue（3）文件内容。1、index.vue<template> <div> <component :is="component"></component> </div></temp
2022-05-11 18:56:55
2804
1
原创 Nuxt首屏加载使用loading动画
1、创建一个loading组件在components文件夹下创建Loading.vue(下面这种是故意使用setTimeout来延迟执行，给页面加载有时间渲染页面)根据在本地存储一个num，num为1，延迟8s后执行，num为2,延迟3s后执行注意：countTo是插件，如果不想用就注释这串代码，不影响components/Loading.vue代码：<template> <div class="app"> <div id="loade
2022-04-28 17:33:06
3384
4
原创 Vue首屏加载loading动画界面和路由跳转动画
1、首屏加载等待界面（1）在public的index.html里面的id为app的div标签里面添加<body> <noscript> <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</st
2022-04-28 17:28:44
3966
原创 Vue使用scrollrevealjs
1、安装vuescrollrevealnpm install --save vue-scroll-reveal 2、在main.js里面引用import VueScrollReveal from 'vue-scroll-reveal';Vue.use(VueScrollReveal,{class: 'v-scroll-reveal', duration: 1000,scale: 1,distance: '0px',reset:true,mobile: false,useDe
2022-04-28 17:27:07
1057
5
原创 Nuxt静态部署gitee
1、创建一个Nuxt项目如果有安装npm，可以直接npx create-nuxt-app <项目名>2、看个人爱好选择配置3、打包（1）服务渲染打包（SSR渲染）npm run build(*).nuxt文件在运行之后就自动出现在项目目录运行命令：npm run dev打包完，会出现在.nuxt文件里的dist（2）静态化打包npm run generate打包完，会出现在项目目录下面出现一个dist文件夹4、打包完部署到git
2022-04-28 17:23:20
1135
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人