Pioneer

原创 Nginx通过location反向代理网站找不到CSS，JS及图片问题解决方案

通过location划分来反向代理多个网站，意思是使用同一个域下(协议、域名、端口均相同)，通过路径的划分来代理不同的网站/服务。

原创 如何快速改变视频文件的hash值？

视频剪辑可以修改hash值，但如果大批量的话，这样做效率太低了。如下，可以批量修改视频文件hash值。

原创 react-native base64加密解密库（crypto-js）

CryptoJS的FunctionUtil方法封装。CryptoJS的安装。CryptoJS的使用。

原创 VMware虚拟机三种（桥接、NAT、仅主机）网络配置的区别—实现与主机、局域网及外网通讯

VMware为我们提供了三种网络工作模式，它们分别是：Bridged（桥接模式）、NAT（网络地址转换模式）、Host-Only（仅主机模式）。什么是桥接模式？桥接模式就是将主机网卡与虚拟机虚拟的网卡利用虚拟网桥进行通信。在桥接的作用下，类似于把物理主机虚拟为一个交换机，所有桥接设置的虚拟机连接到这个交换机的一个接口上，物理主机也同样插在这个交换机当中，所以所有桥接下的网卡与网卡都是交换模式的，相互可以访问而不干扰。在桥接模式下，虚拟机ip地址需要与主机在同一个网段，如果需要联网，则网关与DNS需要与主机网

原创 项目上线部署过程相关问题记录

CentOS下安装jdk：Ubuntu下安装jdk：检查版本：如果输出以下类似内容即代表成功如果还是显示的是之前版本，则编辑profile文件，文件路径 /etc/profile ，在最后加上以下语句2.宝塔面板设置MySQL打开阿里云服务器开放3306端口进入宝塔面板 ，点击安全 放行端口在宝塔数据库中点击权限，访问权限设置成所有人3.远程访问数据库连接远程数据库时 Access denied for user ‘root‘@‘xxx.xxx.xxx.xxx‘ (using pas

原创 如何将.sql文件导入数据库

打开命令提示符行输入以下命令进入本地数据库2. 创建数据库新建一个新数据库用来导入.sql数据3. 导入.sql文件在导入.sql文件之前，设置一下编码模式，防止出现中文乱码的情况（第一次导入就出现了中文乱码，所以中添加一步防止出现乱码情况）。以上就是将.sql文件导入数据库的全部操作，这是打开新建的数据库就能看到导入进去的表内容。...

原创 MySQL数据库忘记密码之修改密码

MySQL数据库忘记密码之修改密码

原创 判断当前时间是否在指定日期范围内

废话不多说，直接上代码/** * 判断当前时间是否在指定日期范围内 * @Author: Lai Chengliang * @Date: 2022/04/24 16:02 * @param date [beginDateStr] [开始日期] yyyy/MM/dd * @param date [endDateStr] [结束日期] yyyy/MM/dd * @return Boolean */export const isDuringDate = (beginDateStr, endDat

原创 RN android无线调试

1.前置条件手机和电脑处于同一网络2.步骤手机打开USB调试模式USB连接电脑,打开cmd进入项目代码的android目录输入adb命令连接手机// 设置监听的端口,端口号自定义.// 设置成功会显示restarting in TCP mode port: 5656adb tcpip 5656// adb调试服务连接到手机, 这里的ip是你手机的ip,端口为上面设置好的端口// 可以在手机的wifi 设置中查看// 设置成功显示 connected to 10.6.8.18:5

原创 解决win7下nodejs安装运行报错：Node.js is only supported on Windows 8.1, Windows Server 2012 R2... 之不支持高版本问题

最近找了一个开源项目，要求高版本node，于是我直接把node版本更新到了16.0.0，结果node -v时报错；后来查资料才知道2020年开始微软对window7操作系统不在维护，所以导致我们日程开发时，会出现很多意想不到的问题。原因：安装的nodejs版本对于不在维护window7操作系统来说，版本太高了，不在支持了经过本人尝试，最终得到的结果是nodejs 13.14.0版本是在win7上被支持的最后一个版本！解决办法：安装低版本的nodejs（降级安装 v13.14.0之前的版本）

原创 Nginx搭建服务器

第一步：下载安装包Nginx下载地址第二步：解压到合适的位置，修改配置我这边是解压到D:\Program Files (x86)\nginx-1.21.6目录下，然后打开conf文件夹找到nginx.conf配置文件，用Notepad++打开修改下面几个配置即可搭建简单的服务器，如果需要文件共享服，配置 autoindex on；然后删除根目录 html文件夹里面的index.html入口文件即可第三步：开启服务及相关命令上面配置完成后，就可以开启服务了。可以在根目录下双击 nginx.e

原创 手把手教你如何安装多个node版本

最近好多人都问到node怎么同时安装多个版本? 如何配置node的环境变量,如何自如的在多个版本中切换node?（因为是在云内断网开发，使用不了nvm工具）有时候会因为node的版本过高或者是太低用命令启动时候而报错，试了一下是否可以安装一个高版本和低版本的node在一个系统中，你如果需要高版本的切换高版本的node，如果需要低版本的切换低版本的node，这样这个问题就会完美解决了。第一步：下载好需要安装的node程序（不要用安装包，用压缩包，这是坑，安装包安装后面再说）nodejs下载地址下载好.

原创 git reset之后找回本地未提交（未add+commit）的代码

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar

原创 win10可以上网但显示无法连接到Internet

国庆放假回来发现公司win10的电脑可以正常上网但是不能开启移动热点，可右下角的网络连接却显示感叹号，点进去显示无Internet连接。百度了一圈找到了个方法试了一下的确可以，有相同问题的朋友可以测试一下。方法/步骤1、点击网络，进入设置2、点击更改适配器3、右击网络图标，打开【属性】窗口4、点击上面的【配置】按钮5、打开配置窗口，点击【高级】选项6、在属性列表中选中“IPV4硬件校验和”7、把右边的值改成“关闭”，此时网络连接会重新断开再连接，连接上就会显示已连接。8、再返

原创 Promise：Promise.all、Promise.race、Promise.any的用法及区别

在项目开发过程中经常需要通过异步编程来实现功能，此时就需要我们了解Promise.PromisePromise 是异步编程的一种解决方案，比传统的解决方案回调函数和事件更合理和更强大。有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。一个Promise的当前状态必须为以下三种状态中的一种：等待态（Pending）、执行态（Fulfilled）和拒绝态（Rejected），状态的改变只能是单向的，且变化后不可在改变。一个Promise必须提供一个 then

原创 Git版本回退之 reset 和 revert

在开发过程中，可能会遇到过错误提交的情况。这种情况下，先不要着急，可以通过以下两个命令来帮助你优雅的实现版本回退。git reset假如现在有如下几个提交：其中：A 和 B 是正常提交，而 C 和 D 是错误提交。现在想把 C 和 D 回退掉。而此时HEAD 指针指向 D 提交（5lk4er）。我们只需将 HEAD 指针移动到 B 提交（a0fvf8），即可。这个时候就可以使用git reset 命令：git reset --hard a0fvf8 // 将HEAD指针移动到B提交点git pus

原创 hexo部署到github时，提示typeError [ERR_INVALID_ARG_TYPE]: The “mode“ argument must be integer. Receive...

最近在部署hexo博客到github时，遇到了这样一个报错：typeError [ERR_INVALID_ARG_TYPE]: The "mode" argument must be integer. Received an instance of Object查阅相关文章得知，是node版本过高导致的（我用的是v14.11.0），将node版本换为v10.16.0版本后，部署就成功了！如果你的其他项目中有需要使用高版本的node，那么你可以使用nvm来进行node版本切换，nvm的安装可以参照以下

原创 Node版本的升级和降级之node版本管理工具nvm

有时候，不同的项目需要使用不同的node版本。我们可以使用nvm管理不同的node版本。下载安装nvm下载地址下载后解压直接下一步，下一步，安装完成即可常用nvm命令查看安装过的node版本 nvm list安装某个node版本 nvm install <version>使用某个node版本 nvm use<version>卸载某个node版本 nvm uninstall <version>...

原创 webpack打包之clean-webpack-plugin插件 默认下载4.0.0版本的踩坑记录

关于使用clean-webpack-plugin插件打包报错问题，起初在网上寻找解决方案，有很多相关的文章博客都有谈到。起初使用插件报错TypeError: CleanWebpackPlugin is not a constructor解决方案一之插件引入方式错误const CleanWebpackPlugin = require('clean-webpack-plugin'); // 1.0.0版本 2.0.0版本const { CleanWebpackPlugin } = require('

原创 npm安装报错Error: EPERM: operation not permitted解决方案

电脑重装系统后重新配置环境安装node后，npm命令安装报错Error: EPERM: operation not permittednpm ERR! code EPERMnpm ERR! syscall mkdirnpm ERR! path C:\Program Files\nodejs\node_cache\_cacachenpm ERR! errno -4048npm ERR! Error: EPERM: operation not permitted, mkdir 'C:\Progr.

原创 js实现数组对象去重

数组对象去重，可直接复用/** *数组对象去重 * * @param {Array} arr 去重数组 * @param {String} key 唯一标识 */deduplication(arr, key) { const obj = {} // 利用reduce方法遍历数组，reduce第一个参数是遍历要执行的函数，第二个参数是item的初始值 return arr.reduce((item, next) => { if (!obj[next[key]]) {

原创 解决element-ui table 表格排列错位问题

有时候页面切换页签时会发生table表格排列错位，是因为切换页签时table表格没有重新渲染导致解决办法：每次切换页签时重新渲染table表格即可解决// 在table上添加key，每次切换页签时更新key值<el-table :key="tableKey" :data="tableData"</el-table>// 切换页签方法handChang() { ++this.tableKey}...

原创 解决element-ui table show-summary合计行不显示问题

在table的底部添加合计设置show-summary就可以了但是给table加了一个固定高度话，就不显示了，其实这个合计是存在的解决办法：在vue的生命周期updated调用一下doLayout就可以了updated () {　　this.$nextTick(() => {　　　　this.$refs.table.doLayout()　　})}...

原创 vxe-table安装和使用

vxe-table是一个基于vue的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等...安装npm install xe-utils vxe-table引入import Vue from 'vue'import 'xe-utils'import VXETable from 'vxe-table'import 'vxe-table/lib/sty..

原创 发布订阅模式 仿写Vue事件监听手写js实现

Vue组件中，可以使用$emit，$on，$off分别来分发、监听、取消监听事件实现组件通信，比较方便；最近空闲时间手撸代码实现了发布订阅模式，可以进行组件通信。话不多说，直接上代码/** * Created by laichengliang on 2021/04/13. */const center = {}// 事件监听center.on = (eventName, callback) => { if (!center[eventName]) center[ev..

原创 禁用f12键 开发者工具 右键菜单

disable-devtool 可以禁用所有一切可以进入开发者工具的方法，防止通过开发者工具进行的 ‘代码搬运’该库有以下特性:支持可配置是否禁用右键菜单 禁用 f12 和 ctrl+shift+i 快捷键 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面 开发者可以绕过禁用 (url参数使用tk配合md5加密) 支持几乎所有浏览器（IE,360,qq浏览器,FireFox,Chrome,Edge...） 高度可配置 使用极简、体积小巧 (仅7kb) 支持npm引用和scrip...

原创 Promise之异步调用

原创 git永久保存账号密码

在git bash 中执行命令：git config --global credential.helper store在输入一次账号密码就可以永久保存了，免去git重复输入账号密码操作

原创 webpack安装

一、什么是webpackwebpack是一款模块加载器兼打包工具，它能把各种资源，例如JS（含JSX）、coffee、样式（含less/sass）、图片等都作为模块来使用和处理。 webpack 的核心是 依赖分析,把依赖分析出来了，其他都是细枝末节了二、安装webpack注意：需提前安装node和npm！！！1.全局安装：npm install webpack -g ...

原创 Git设置SSH

GitHub上连接已有仓库时的认证，是通过使用SSH的公开密钥认证方式进行的。我们首先来创建SSH key，并将其添加到GitHub上。前提是要初始化设置姓名和邮箱地址1、创建SSH Key$ ssh-keygen -t rsa -C "[email protected]"按回车键后输入密码和确认密码创建SSH Key成功id_rsa 文件时私有密钥 id_...

原创 vue-cli安装

vue-cli 是vue官方提供的一个脚手架工具，用于初始化一个Vue项目；vue-cli的优势:1、成熟的vue项目架构设计，而且会跟随vue版本的更迭而更新；2、提供了一套本地测试服务器，而且是一个热加载的服务器；3、提供了自己的一套集成打包上线的方案，webpack 或者gulpify在创建项目的时候可以进行选择；有了以上优势，可以非常快速的搭建项目；vue...

原创 Node.js 安装及配置

1、下载安装包Node.js 官方网站下载：https://nodejs.org/en/2、安装打开安装，傻瓜式下一步即可：选择安装位置，我这里装在D盘下：安装成功，按Ctrl+R键输入cmd：此时可以执行 node -v 和 npm -v 分别查看node和npm的版本号：三、环境配置说明：这里的环境配置主要配置的是npm安装的全局模块所在的路...

原创 Git安装及配置

一、安装前准备Git下载地址：https://git-scm.com/download/win二、安装过程1. 下载完成后，双击下载好的软件开始安装2.选择安装路径，这里我安装在D盘3. 点击Next，默认选项和图中不一样，建议按照图中修改，Git Bash Here和Git GUI Here可以方便的在任意目录下打开git，建议选中，选中这两项后Addition...

原创 js获取一周从开始到结束日期范围

1. 以周一作为周开始版本const getWeekDate = (year, week) => { //获取周开始日期 const getWeekStartDate = (year, week) => { // Thursday in current week decides the year. const date = new ...

原创 防抖和节流

1. 防抖触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间* 思路：每次触发事件时都取消之前的延时调用方法function debounce(fn) { let timeout = null; // 创建一个标记用来存放定时器的返回值 return function () { clearTimeout(timeout)...

原创 js实现获取当前周，过去和未来周的时间段日期

function getWeekTime(){ var currentFirstDate; var formatDate = function(date){ var year = date.getFullYear()+'年'; var month = (date.getMonth()+1)+'月'; ...

原创 基于Echarts的HTML5 Canvas折线图柱状图DEMO演示

HTML代码 ：&lt;div id="barChart" style="height: 400px;width:600px;background:white;margin:20px 0 0;"&gt;&lt;/div&gt;JavaScript代码 ：var barChart = { title: { text: '折柱混合图' ...

原创 基于Echarts的HTML5 Canvas折线图DEMO演示

HTML代码： &lt;div id="lineChart" style="height: 400px;width:600px;background:white;margin:20px 0 0;"&gt;&lt;/div&gt;JavaScript代码： // 绘制图表，准备数据 var lineChart = { dataZoom: { ...

原创 React 正常渲染后端返回的HTML代码

1、解决React项目后台接口返回HTML 文本时无法解析渲染成正常的html问题：&lt;div dangerouslySetInnerHTML = {{__html:返回的html代码}} &gt;&lt;/div&gt; 

原创 Echarts API说明文档

官网链接：http://echarts.baidu.com/echarts2/doc/example/themeDesigner.html theme = { // 全图默认背景 // backgroundColor: 'rgba(0,0,0,0)', // 默认色板 color: ['#ff7f50','#8...