Mr__proto__的博客

原创 实现移动端和pc端响应式css封装

实现移动端和pc端响应式css封装

原创 请求报错blocked:csp

项目架构:electorn+react+axios。此报错是因为mate标签里写了如下代码。解决办法就是先把这段代码注释掉。代码用途是,防止跨域脚本攻击。

原创 el-table-column嵌套el-form-item不能进行校验问题解决

此处先描述一下，问题出在了哪里，我将el-table的data,使用一个ref数组存储，表格校验使用了一个对象存储，导致，校验的时候拿不到数据，代码如下。业务要求：table表格展示数据，其中有一行是ip地址可展示可修改，此处要求增加自定义校验规则。以下是正确代码，就是将tableData和probeIpFormRules放到同一个对象里。项目为vue3+elementPlus开发的项目。

原创 electorn+vue3项目启动后报错unsafe-eval，如何去除提醒

【代码】electorn+vue3项目启动后报错unsafe-eval，如何去除提醒。

原创 如何解决无法npm下载electron依赖的

使用命令：npm config set ELECTRON_MIRROR http://npm.taobao.org/mirrors/electron/也用了npm的镜像：registry = "https://registry.npmmirror.com/"，也不行。后来网上折腾一段时间，看到一个开源项目（基于electron)，写到要在npm设置electron的镜像，才可以。使用electron，安照官方例子，结果是失败的。完后，再重新npm install，再npm start，解决。

原创 vite打包优化分片打包依赖包

上述拆分方式是自动将所有的包都单独拆分出来，优点就是不用手动配置，但是也有缺点，就是有的第三方包体积很小，会拆分出大量文件，反而降低请求效率。当项目使用pnpm进行管理包的时候再进行打包就会打出一个非常大的.pnpm包，这就不符合我们的预期了，我们要的就是小一点的包来进行本地缓存。assetFileNames 资源文件名，统一放到assets/js(jpg/png/ttf/css等)/目录下。还不知道怎么解决，目前就是不使用pnpm就恢复正常了，如果有大神知道怎么解决希望能留一下言。

原创 如何在shell脚本将node_modules里的文件复制一份到public文件里

地图边界线数据包会有数据更新不及时的情况，因此我们要每次部署都使用最新的数据包，所以这个时候就要这个插件"static-geo-atlas" 这个插件数据格式是antvl7plot推荐使用的，但是每次都手动下载-复制-粘贴，很麻烦，因此我希望在每次打包的时候自动执行。本地只能用自己手动。项目背景：由于公司网络不连接公网，所以在绘制地图大屏项目时，需要我们将边界线数据包也部署起来，来获取边界线数据。1.让后端写个接口或者找个地方将数据包放到服务器即可。找到jenkins构建环境的执行脚本位置。

原创 如何获取最新的底图边线数据（高德）

获取最新的地图边界线数据，高德api

原创 解决[Vue Router warn]: No match found for location with path “/day“问题

vue-router警告[Vue Router warn]: No match found for location with path "/day"问题

原创 解决vue项目中package.json文件提示报错问题

新建一个vue3的项目发现在package.json文件老是被VScode编辑器提示以下报错，经过强大的搜索之后发现这是由于,无法从此地址(vscode://schemas/settings/configurationDefaults)加载模块,解决方法：在项目根目录的.vscode文件夹下增加settings.json文件并添加如下配置。

原创 苹果电脑出现zsh: command not found: pnpm解决方法：

如果到此你已经解决了问题，那恭喜你了，可题主我就没这么幸运，我在terminal执行source .zshrc时报找不到bash_profile，坑爹的有些mac就是没有bash_profile这个文件，需要手动新建，如果你也是这样请继续跟我操作。这时候就有了bash_profile这个文件，当然是没有内容的空文件，这里又需要你写入path，我接下来是这么操作的。看哪个奏效，这一步就在zshrc执行时将 .bash_profile 全部环境变量加入zsh shell了。terminal执行。

原创 如何使用antvg6自定义节点

使用antvg6绘制树状图但是节点样式不符合要求，如何自定义节点

原创 重写rotuter.push方法

vue2.6版本需要重新rotuter.push方法，因为这个版本要传入第二个和第三个参数let originPush = VueRouter.prototype.push;let originReplace = VueRouter.prototype.replace;//重写VueRouter.prototype身上的push方法了VueRouter.prototype.push = function(location, resolve, reject) { //第一个形参：路由跳转的配置对象

原创 记一个el-dialog弹窗修改el-select和el-date-picker输入框样式的坑

要求是dialog弹窗上有两个输入框，领导觉得样式不好看需要修改输入框的样式。这里我要采用的是在scoped中避免污染全局，做法如下。这个样式在全局修改很简单，网上有很多方式。

原创 antvG6绘制树形图踩坑记录（自定义节点等功能）

antvg6 树状图 vue2

原创 antvl7绘制地图以及vue项目中使用多线程worker

多线程 vue2 worker 事件循环 计时器

原创 uniapp写h5如何封装一个图片上传预览并且有进度条的组件

uniapp+阿里云存储，实现h5页面图片上传进度条，预览看原图，总览看缩略图，带h5压缩功能

原创 uniapp开发公众号H5时用户缓存无法清除问题

uniapp开发公众号H5时用户缓存无法清除问题

原创 vue中如何使用file-saver插件保存各种格式文件

vue中如何使用file-saver插件保存各种格式文件

原创 vue中Table表格转为Excel文件的方法

Table2Excel组件封装

原创 vue中aes加密封装

aes加密的封装

原创 点击按钮出现波纹效果自定义指令

使用vue开发h5移动端时，需要按钮点击出现波纹效果，此时封装成自定义指令是最棒的效果，代码如下js部分 waves.jscss部分 waves.css使用时

原创 h5移动端配合微信sdk常用的9个工具函数

h5yidongdau8n配合微信常用的9个工具函数

原创 git 分支管理推荐规范

git 分支管理推荐规范

原创 修改依赖中的源代码node_modules中的代码

项目背景：使用uniapp开发微信小程序和支付宝小程序跨端开发，在微信小程序中时间选择器的样式没问题，但是在支付宝小程序中时间选择器样式会错乱解决方案：把node_modules中的uview-ui中的u-picker.vue文件中的<text>标签更改为<view>b标签即可恢复正常带来的新问题：修改依赖中的源码，在下次拉代码时，势必会失去效果，因此考虑使用patch-package插件来保存修改位置使用方法第一步：npm i patch-package -

原创 uniapp中小程序页面结合二维码导出图片的方法

用uniapp写微信小程序将页面和二维码一同转为图片并保存

原创 用uniapp写小程序遇到的坑

封装uniapp地址选择器手写板插件生成海报插件

转载 win10 git 命令行出现 no matching host key type found. Their offer: ssh-rsa 解决方案

背景：win10电脑, 公私钥都已经配置好。一 现象：配置好公私钥之后，仍然无法直接用 git ssh的方式，下载代码。出现形如no matching host key type found. Their offer: ssh-rsa 的错误.二. 解决方案：C:\Users\walkerjiang.ssh\config增加以下二项HostKeyAlgorithms ssh-rsaPubkeyAcceptedKeyTypes ssh-rsa最终如下：Host gi.

原创 【无标题】

第一步：create ssh keyssh-keygen -t rsa -C "[email protected]"添加key到git账号管理中第二步：config gitgit config --global user.name "your-username"git config --global user.email "your-email-address"第三步：pull request用法本地新建 开发分支（如dev）；push 开发分支（如dev）到git仓库中

原创 前端面试题，解决跨域的方法--实际项目中的做法

解决跨域的实际方法

原创 pro环境前端跨域报错的坑

线上pro环境，前端报错crosserr业务场景： 项目升级，整套前后端以及数据库都要切换环境，其实只要复制粘贴代码，配置对应好即可，全部配置部署的时候更改很多配置项，其中少配置一行导致前端跨域解决方法：第一步：登录Apollo找到对应的服务，第二步：增加红框里的这行注释：这行指向的是后端Java代码中解决跨域的解释：Java代码中这行是解决跨域的代码，它的原理是在响应头里添加允许跨域的键值对踩坑，谨记！！！！...

原创 start value has mixed support, consider using flex-start instead报错解决

postcss-loader警告处理

原创 apollo中配置前端跨域

1.首先要到运维处申请账号权限2.拿到Apollo地址后登录界面如下：3.点击其中一项进行配置，打开后点击如下：4.将文本里的配置项更换为你想修改成的样子然后点击对号然后点击发布5.确认无误并且没有报错就点击发布即可注意：里面的配置项必须都是k=v键值对格式，一般需要配置以下地址，及对应的参数MySQL地址Apollo地址mango地址kafaka地址6.具体配置项如下......

原创 如何用el-Pagination封装一个全局可用的分页器

项目背景：vue项目+elementUI直接上代码新建一个组件components/Pagination/index.js<template> <div :class="{'hidden':hidden}" class="pagination-container"> <el-pagination :background="background" :current-page.sync="currentPage" :

原创 前端vue项目中如何把base64转换为图片并下载

html2canvas插件画出一个图并下载到本地

原创 jsconfig首行报错问题的解决方案

原创 node基础

node基础学习

原创 vue中如何定义自定义拖拽指令

当一个dialog弹窗不能拖拽的时候将是多么痛苦的时刻因此只要在src文件夹中新建directive文件夹再新建drag.js文件，写入如下代码，就能实现自定义拖拽指令import Vue from 'vue';Vue.directive('drag',{ bind:function(el){}, inserted:function(el){ el.onmousedown = function (e) { var disx = e.pageX - el.offsetL

转载 手把手教Electron+vue的使用

手把手教Electron+vue的使用 - 阿长*长 - 博客园

原创 自定义el-date-picker控件

需求：element ui中日历选择器控件需要定义选择时间为60 天，并且要求每次选择后都要清空限制具体代码如下;<!--html标签--> <el-date-picker v-model="saveForm.dateselect" type="daterange" range-separator="至" start-placehold