- 博客(143)
- 收藏
- 关注
RSS订阅
原创 k8s（阿里云）
环境操作系统：ubuntu18.10docker：docker-ce 18.06kubernetes：k8s 1.13.1操作步骤安装（https://www.runoob.com/docker/ubuntu-docker-install.html）卸载旧版本 apt-get remove docker docker-engine docker.io containerd runc...
2019-12-11 18:36:08
1079
原创 vue-router简易实现
前端路由主要指url地址发生了变化，但是不用刷新整个页面去实现局部页面的无感刷新，用户感觉是在不同的两个页面，但实际上是在同一个页面。 我们需要考虑两个问题：保证url地址改变了，但是页面不能刷新；如何去监听url地址改变。路由模式hashHash 模式其实就是通过改变 URL 中 # 号后面的 hash 值来切换路由，因为在 URL 中 hash 值的改变并不会引起页面刷新，再通过 hashchange 事件来监听 hash 的改变从而控制页面组件渲染。history它提供了 p
2022-03-18 11:12:57
1187
1
原创 nodejs将html转换成json
const fs = require('fs')const { parser } = require('posthtml-parser')const html = fs.readFileSync('test.html', 'utf-8')const result = parser(html)fs.writeFile('./ast.json', JSON.stringify(result), 'utf-8', function(error) { console.log('写入成功');});
2021-12-24 13:48:43
1099
原创 nodejs stream请求
客户端let file = {path: '文件路径', file: '文件名字'}const req = http.request({ host:'localhost',//远端服务器域名 port:3000,//远端服务器端口号 method:'POST', path:'/upload',//上传服务路径 headers:{ 'Content-Type':'multipart/form-data', 'Connection':'keep-alive', 'file': file
2021-12-10 17:26:07
563
原创 实现自己的axios
在实践过程中，我们发现axios源码经常使用，今天我们就自己实现一个axios（不包括nodejs）axios实现get，post实现新建一个axios目录，在里面新建index.js这里我们需要把自己的axios导出，代码如下：import Axios from './axios'const axios = new Axios()export default axios接下来新建axios.js文件class Axios { constructor() {}, get(){}
2021-11-26 17:02:56
820
原创 webpack5联邦模块
定义webpack5 新增了模块联邦的能力，项目之间形成共享作用域，可以在一个项目里使用其他项目中的组件，实现跨应用的组件共享。项目A引用了项目B中的组件，A为宿主系统，B为远程系统，通过在B中暴露模块，在A中配置引入的项目名以及引用的组件等，这样在A的业务代码中可以直接通过 import() 来引入组件。...
2021-10-25 10:48:03
764
原创 bit组件共享
简介bit是一种类似于npm的包/组件公共库。由于npm发布的资源、数据全部都是公开的，所以对项目的部分源代码并不适用。同时，bit提供了私有集合，私有集合与公开集合的使用并无任何区别，但是只有管理者（master）与受邀请的开发者（developer）能使用。bit允许每个用户创建一个免费的私有集合。若需要更多的私有集合，需要交付月金。注册https://bit.dev/login创建集合创建自己的集合，可以取任何名字，也应该尽可能简便，避免使用时造成不必要的麻烦。本次测试可以创建一个公共集合（
2021-08-17 18:47:15
634
原创 nodejs webhook通知微信（企业微信）代码
微信webhook：代码如下：var http = require('http');const axios = require('axios');var server = http.createServer(function (req, res) { // 接收 POST 数据。如果请求方法不是 POST，那么这个变量最终是空字符串 var POST = ''; req.on('data', function (chunk) { POST += chunk;}); req.on('end
2021-07-28 23:15:55
802
原创 nodejs sftp上传
// deploy.js/** * 部署之前请检查好要部署的路径 * 如有多个环境，自行拓展 */const gulp = require("gulp")const sftp = require("gulp-sftp-up5")const sftpConfig = { // 此处的key对应着package.json中脚本的 APP_ENV test: { remotePath: "/test", // 部署到服务器的路径 host: "39.106.10.163", // 服
2021-06-28 09:54:58
479
转载 前端性能衡量指标
链接：https://blog.csdn.net/weixin_40906515/article/details/106394217?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_title-9&spm=1001.2101.3001.4242
2021-02-27 21:18:09
743
原创 前端录屏工具开发--可用于工程化错误回放
rrwebhttps://github.com/rrweb-io/rrweb/blob/master/guide.zh_CN.mdhtml页面直接引入，代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"
2021-02-09 22:48:48
448
原创 前端工程化--文件同步
rsync安装（centos）https://blog.csdn.net/qq_35765928/article/details/105281778注意这里只做到安装好虚拟机2就可以了，尝试此文章同步命令出现错误，正确参考如下命令重启rsync ps -ef|grep rsync|grep -v grep|awk '{print $2}'|xargs kill -9/usr/bin/rsync --daemon一台服务器同步rsync -r 源目录 目标目录注意这里必.
2021-01-14 16:51:16
124
1
原创 vue国际化，同时样式变换（阿拉伯语版）
由于阿拉伯语与中文相反，中文从左向右，阿拉伯语与中文所有的一切都相反，如图所示：英语阿拉伯语在进行英文与阿拉伯语切换，除了语言上体现不一样，布局也要进行变化，具体代码如下：代码language/en.jsexport default { en: { slide1: { beeto: 'Beeto', born: 'Born in Arab', for: 'For Arab', info: 'all in lanbg jjfa
2020-12-30 18:56:13
2275
原创 Vue项目使用eslint + prettier规范代码风格（git提交）
eslint VS prettiereslint总体来说，linters有两种能力：检查代码质量，比如是否有已定义但未使用的变量，或者使用函数式编程的函数是否产生副作用等。检查代码风格，比如每行的最大长度，或者是否使用拖尾逗号等。prettierpretter没有对代码的质量进行检查的能力，其只会对代码风格按照指定的规范进行统一，避免一个项目中出现多种不同的代码风格。配置husky和lint-staged由于直接使用prettier进行代码格式化仍存在一些弊端，例如：一次性对所
2020-12-28 15:11:53
699
1
原创 暗黑模式切换（vue版）
网上很多方法都采用scss，现在用原生css实现一种简单版mode.vue（随便定义名称）： // 在data里面定义mode为false /* * 模式切换 * */ fnChangeMode(){ this.mode = !this.mode; if (this.mode == true) { window.document.documentElement.setAttribute('data-theme', 'dark')
2020-12-23 20:25:26
6505
原创 原生js--直播弹幕
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #wrapper{ width: 100%; height: 400px; background-color: #000;
2020-12-11 17:37:50
261
转载 inquirer.js —— 一个用户与命令行交互的工具
参考：https://blog.csdn.net/qq_26733915/article/details/80461257
2020-12-09 11:30:22
245
原创 gitlab ci/cd自动化部署流程
环境安装nginx安装（这里不做讲述）git安装gitlab安装gitlab-runnernginx默认指向/gitci/ci/dist目录，这里我们在root账户里只创建/gitci，至于/ci/dist使我们在其他用户gitlab-runner里面完成，下面是具体操作gitlab-runner安装流程curl -L https://packages.gitlab.com/install/repositories/runner/gitlab-ci-multi-runner/scri
2020-12-03 18:53:37
3992
2
原创 js算法--前 K 个高频元素、寻找峰值和合并区间
前 K 个高频元素给定一个非空的整数数组，返回其中出现频率前 k 高的元素。示例 1:输入: nums = [1,1,1,2,2,3], k = 2输出: [1,2]示例 2:输入: nums = [1], k = 1输出: [1]方案function getMap(arr) { let obj = {}; for(let key in arr){ if(!obj[arr[key]]){ obj[arr[key]] = 1
2020-11-23 14:51:59
422
原创 js算法--寻找峰值
解释峰值元素是指其值大于左右相邻值的元素。 给定一个输入数组 nums，其中 nums[i] ≠ nums[i+1]，找到峰值元素并返回其索引。 数组可能包含多个峰值，在这种情况下，返回任何一个峰值所在位置即可。 你可以假设 nums[-1] = nums[n] = -∞。示例输入: nums = [1,2,3,1] 1输出: 2 2解释: 3 是峰值元素，你的函数应该返回其索引 2。方法一使用数组的 reduce 方法遍历数组，设其初始值为 0。当遍历到的值大于上一次返回的下标所对应的
2020-11-19 11:30:35
704
原创 js算法--合并区间
给出一个区间的集合，请合并所有重叠的区间。输入: [[1,3],[2,6],[8,10],[15,18]], 1输出: [[1,6],[8,10],[15,18]]。 2解释: 区间 [1,3] 和 [2,6] 重叠, 将它们合并为 [1,6]方法一 合并重叠思路：从示例入手：[1, 3] [2, 6] 是否可以合并只要对比 [1, 3]的最大值 3，[2, 6]的最小值 2，3 >= 2 ，则说明可以合并，否则不能。.[1, 3] [2, 6] [8,10]，从3个来看，如果 [2, 6
2020-11-18 14:36:12
1058
原创 js算法--搜索二维矩阵 II和计算右侧小于当前元素的个数
搜索二维矩阵 II编写一个高效的算法来搜索 m x n 矩阵 matrix 中的一个目标值 target。该矩阵具有以下特性：每行的元素从左到右升序排列。 每列的元素从上到下升序排列。实例现有矩阵 matrix 如下： [ 3 [1, 4, 7, 11, 15], [2, 5, 8, 12, 19], [3, 6, 9, 16, 22], [10, 13, 14, 17, 24], [18, 21, 23, 26, 30] ] 给定 target = 5，返回 true。
2020-11-17 16:45:13
202
原创 js算法--计算右侧小于当前元素的个数
题目给定一个整数数组 nums ，按要求返回一个新数组 counts 。数组 counts 有该性质： counts[i]的值是 nums[i] 右侧小于 nums[i] 的元素的数量。分析输入: [5,2,6,1] 1输出: [2,1,1,0] 2解释: 35 的右侧有 2 个更小的元素 (2 和 1). 42 的右侧仅有 1 个更小的元素 (1). 56 的右侧有 1 个更小的元素 (1). 61 的右侧有 0 个更小的元素.代码方案1暴力法很简单，遍历每个
2020-11-16 10:19:55
423
原创 log4js node日志管理
安装npm install --save log4js增加配置文件根目录下新建config目录 conifg目录下全为配置文件config目录下 新建文件 logs.jsvar path = require('path');//日志根目录var baseLogPath = path.resolve(__dirname, '../logs')/*报错输出日志*/// 请求日志目录let reqPath = '/request';// 请求日志文件名let reqFileName
2020-11-13 18:39:27
721
2
原创 前端深色模式，浅色模式
代码<!DOCTYPE html><html lang="en"><head> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/> <meta charset="UTF-8"> <title>Title</title> <style> *
2020-11-06 18:53:48
789
原创 抖音爱心特效
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .heart{ background-image: url("http://panjiachen.github.io/warehouse/twitterLike/images/we
2020-11-04 20:00:20
1335
原创 前端脚手架上传工具（适合于ftp）
代码链接https://gitee.com/niuyueyang_1_18335774773/deploy-cli
2020-10-22 17:03:21
391
原创 webRtc视频通话（jquery，node）
程序nodejs，jquery定义WebRTC(Web Real-Time Communication) 网页即时通信 ，是一个支持网页浏览器进行实时语音、视频对话的API。于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准WebRTC组成...
2020-10-12 14:18:47
763
原创 vue3.0学习文档
删除的apion，on，on，off，$once$on，$off，$once被删除实例方法。应用程序实例不再实现事件发射器接口vue2.X版本eventBus.jsconst eventHub = new Vue()export default eventHubchildComponent.vue// ChildComponent.vueimport eventHub from './eventHub'export default { mounted() { //
2020-09-21 17:38:32
814
转载 监听URL pushstate与replacestate
var _wr = function(type) { var orig = history[type]; return function() { var rv = orig.apply(this, arguments); var e = new Event(type); e.arguments = arguments; window.dispatchEvent(e); return rv; };}; history.p
2020-08-12 17:04:22
441
原创 node ftp上传
const fs = require('fs');const FTPClient = require('ftp');const path = require('path')const dirPath = path.join(__dirname, './dist'); // 本地FTP目录const remoteFtpPath = '/t1/star-pc-upload/test'; // 远程FTP目录const localFiles = []; // 本地文件let localFileLen
2020-08-06 08:50:45
547
1
原创 缓存设置（失效时间）
/** @desc 缓存* @params* preId {String, Number} 缓存前缀* time {Number} 缓存时长* @author niuyueyang* @date 2020/08/05* */const BaseStorage = function (preId) { this.preId = preId || 'WEIBO-'; this.time = -1;}BaseStorage.prototype = { status: {
2020-08-05 17:58:17
1200
原创 gitlab ci/cd 前端自动化部署
解释与安装https://juejin.im/post/5b03963a51882542821ca56a注意事项https://www.jianshu.com/p/4bbef46a2aaa需要的url和token可以从git仓库的 Settings - CI/DI 中的runners找到，描述可以不用写，tags先写“vue-dev-pub”，executor选择shell，注册生成后刷新git仓库的Settings页面，可以在Runners下面看到已经注册的runner操作新建 /web/p
2020-07-24 01:55:12
799
4
原创 手把手教你打造一个 Nexus 的私有npm服务器
下载docker pull sonatype/nexus3 # 拉取镜像mkdir -p /data/nexus/data #建立目录chmod 777 -R /data/nexus/data # 建立目录docker run -d -p 8081:8081 --name nexus -v /data/nexus/data:/nexus-data sonatype/nexus3 # 启动docker logs -f nexus # 日志查看访问nexus密码操作查看管理员admin密
2020-07-15 21:35:42
369
原创 前端面试总结
js基础for和forEach的区别：1.for循环按顺序遍历，forEach使用迭代器遍历2.for循环是随机访问元素，foreach是顺序链表访问元素3.对于arraylist，是顺序表，使用for循环可以顺序访问，速度较快；使用foreach会比for循环稍慢一些。对于linkedlist，是单链表，使用for循环每次都要从第一个元素读取next域来读取，速度非常慢；使用foreach可以直接读取当前结点，数据较快；let，const和var的区别https://blog.csdn.
2020-06-05 14:08:24
693
原创 vue dom diff算法
index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>dom diff算法</title></head><body> <div id="root"></div> <script src="js/element.js"></scri
2020-06-02 14:33:51
157
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人