胡聊前端的博客

在操作文本框或者可编辑元素的时候，我们可能会使用到这两个api。在这里简单记录下区别。RangeSelectionSelection 指代的是用户选择的区域。该区域可以是多个，但目前谷歌并不支持选择多个，但Firefox应该是支持的。Range也是代表一段区域，这个这个区域是很抽象的，他不像Selection那样你看到了选择的具有蓝色背景的区域，那就是Selection。而Range可以通过js去构造并选择，而实际用户看不到任何选择。下图：selection是可以看到的Range既可以是上

主要使用两个插件Copy Artifact PluginParameterized Trigger pluginCopy Artifact Plugin 用于将子工程打包的出的结果保存。假设我最终会打包一个tar包。首先添加构建后操作步骤，点击归档成品这个步骤，输入用于归档的文件的名称。这个名称的地址是相对于当前工作空间的。这样配置好之后，就可以最终打包成功后保留release.tgz这个包，这个包实际上可以Jenkins中直接下载的。而Parameterized Trigger plu

前言windows家庭版是不支持远程桌面的，专业版和企业版是支持的。所以如果电脑的windows是后二者，则可以忽略本文直接配置。RDP Wrappergithub开源软件RDP Wrapper可以帮助家庭版也支持远程桌面的功能。Github项目地址从下图所示的Release处下载最新的软件包并解压。解压后会有如下的文件列表如上三个.bat结尾的文件分别是：install.bat 安装uninstall.bat 卸载update.bat 更新可以先右键管理员身份安装，之后进

vue-cli项目默认为src目录提供了别名@可按如下方式修改默认的路径// vue.config.jsconst path = require('path')module.exports = { chainWebpack: config => { config.resolve.alias .set('@', path.resolve(__dirname, 'path/to/desination')); }}或者自定义更多路径// v

const getCookie = (name) => document.cookie.match(`[;\s+]?${name}=([^;]*)`).pop();// 比如cookie如下： a=b; c=d// 使用getCookie('c') // d其中match是字符串的原型方法。str.match(regexp)如果传入一个非正则表达式对象，则会隐式地使用 new RegExp(obj) 将其转换为一个 RegExp以上，所以完全不必写一个正则，因为正则拼字符串还

// 各种错误判断和兼容代码略过了。function nextTick (cb, ctx) { // 你传入的回调函数会被依次放入到callbacks数组中。 callbacks.push(function () { cb.call(ctx); }); if (!pending) { pending = true; timerFunc(); }}上边就是调用的nextTick函数// Vue.nextTick 和 this.$nextTick是等价的。

典型的区别Map可以将任何数据类型作为key，而Object，只能使用String或者Symbol。一个 Map的键可以是任意值，包括函数、对象或任意基本类型。const map = new Map();map.set(NaN, 'NaN'); map.get(NaN) // NaNmap.set(null, 'null'); map.get(null) // nullmap.set(undefined, '未定义'); map.get() // 未定义Map的键是按插入顺序

原始JSONconst obj = {a:1,b:{c:2},d:3};格式化代码// 第二参数可以是一个函数用于过滤每一个key，若传null，则所有key都参与格式化。// 第三参数是缩进大小JSON.stringnify(obj, null, 2)格式化结果"{ "a": 1, "b": { "c": 2 }, "d": 3}"如果JSON太长，那么格式化之后的结果如果想复制就很麻烦。谷歌的控制台人性化的帮你提供一个copy方法控制台中输入以下命令后会

随着项目的不断增大，子项目拆分的越来越多，开发过程可能会遇到如下的两个问题：多个项目具有相同的外部依赖，导致重复安装，占用磁盘空间多个项目之间相互依赖，依赖之间的更新流程繁琐（需要发布到npm，或者使用npm link）开源社区中有lerna这样的优秀的monorepo管理工具来解决这两个问题。但其实，这应该属于npm包管理工具自身的问题范围。所以作为后起之秀的yarn，就希望能够通过其原生的workspace去解决这些问题：下面是一个基于yarn workspace测试项目的目录结构，可以看出

更改已有docker容器的映射端口号port mapping

执行yum install nginx 报出标题中的错误，翻译为：没有Nginx包其实yum安装会先到yum源中去下载，若没有发现对应的软件包就会出错。可以通过如下命令来安装EPEL的源（生产环境请谨慎…）：$ yum -y install epel-release之后再次执行即可$ yum -y intall nginxEPEL (Extra Packages for Enterprise Linux ) 是 Fedora Project 为RHEL提供的附加的packages。 简单来说

单网页应用中，页面只有一个index.html的入口文件。如果使用history模式，对于不同的url我们希望最终都可以访问到index.html。一般公司都会使用nginx作为其对外的服务器。在vue-router的官网上，实际上已经写出了如何配置：location / { try_files $uri $uri/ /index.html;}可是看起来不那么好懂，我用简化配置：location / { try_files c.html b.html a.html defult.html

JS作为一门动态类型的语言，在给开发者带来便利的同时，也不可避免的引起一些潜在问题。简单来说，它需要你在编程的时候充分的了解当前对象是否有你要使用的方法或者属性。然后人脑毕竟是有限的。所以就需要一些手段帮你找到潜在的问题。这种手段分为两种：类型检查，也即是TypeScript做的事问题（problem）检查，eslint做的事举个例子，下面的代码展示了二者对各自认为有问题的地方做出提示。// TS 报错 This expression is not callable.// 但eslint则认

在前端领域，经常会对后台数据进行Mock，即模拟假数据。因为前后台往往是并行开发的，我们按照接口文档自行伪造（mock）一些数据。这样在理想状态下，在最终联调时，只需要切换一下配置文件的服务器IP端口即可。业界主流的包括Mock.js和json-server。前者是通过生成随机数据的形式伪造假数据，而后者功能更为强大，他提供了一台服务，并且方便快捷的提供了RESTful API。首先说一下到底什么才算RESTful API。其官方定义是Representational State Transfer 表现

在前端开发中，我们经常会给元素绑定事件。但恐怕对javascript本身事件机制没有太深的关注。在浏览器事件相关的API中，主要有三个接口：EventEventTargetEventListener以上的三个接口就足以完成一个事件的创建，监听，以及派发。// 创建事件const event = new Event('foo');// 事件监听const eventListener= function (e) {console.log(e.detail)};elem.addEvent

文章目录前言权限控制合理的使用组一些优化参考前言在linux中，我们可以使用chmod + chown来控制一个用户对某个文件的权限。简单的说就是某一个用户是否对某一个文件/文件夹有读/写/执行的权限。但如果我就是想编辑或执行其他用户的文件怎么办（贱贱的感觉）这时候可以使用sudo命令sudo ⇒ substitute user do 译为：代替某个用户去做。 语法sudo -u user一般而言，我们都是替代root去做一些事情，所以-u参数可以省略，即默认就是root更多历史背景可以参考维

安装Mysql首先在centos7中，不要使用yum install mysql，这样实际上安装的MariaDB。因为在centos7中的Repository中已经不再包含mysql了。所以我们需要使用mysql yum repository执行如下命令安装源：# 以下版本二选一即可。建议用5.7# mysql 8.0sudo yum localinstall https://dev.mysql.com/get/mysql80-community-release-el7-1.noarch.rp

要回答这个问题，不妨先解释两个概念根域名顶级域名其中根域名是指blog.youkuaiyun.com. 最后边的那个点. 是的，后边有个点…假设你要访问的域名没有任何缓存，那么首先就会访问到根域名服务器，根域名服务器中保存了顶级域名的NS服务器地址。即.com，.cn，.net这类的都是顶级域名。以此类推，csdn只能算是二级域名，而blog则为三级域名但是，虽然定义是这样的，但实际工作中有可能还会称blog为二级域名。即使是阿里云的文档也是这样称呼：所以不必过于纠结名字，知道其原理就可以了。.

该属性主要是防止你手残执行了npm publish，发布了你不想发布的包，或者发布到不想发布的npm私服…当配置了{ "private": true}后执行npm publish，当然前提你登录了，然后就会报出如下的错误：可以看到提示the package has been marked as private 即 只有移除掉该属性才能发布。此外，如果不想每次新建项目都手动设置，可以进行全局配置$ npm config set init-private true...

以下是egg.js的后台代码const Controller = require('egg').Controller;const path = require('path');const fs = require('fs');class HomeController extends Controller { async index() { const filePath = path.resolve(this.app.config.static.dir, 'file_message_to

在commonjs，也就是nodejs中，定义导出的时候其实就是exports对象，比如module.exports = {a: 1, b: 2};

vue维护了自己的事件机制。所以就有了原生DOM事件和自定义事件的区别，比如下面这段官网原话。用在普通元素上时，只能监听原生 DOM 事件。用在自定义元素组件上时，也可以监听子组件触发的自定义事件。本文也将围绕这一句话展开。想必大家都会在自定义组件中自定义事件。<my-component v-on:my-event="doSomething"></my-component>那么如何给自定义组价添加原生事件呢，其实想一想理论上是不可行的，因为自定义组件最终不会渲染到页

准备docker环境如果你使用的是windows或者mac建议直接下载对应的客户端。具体的完全可以按照官方的步骤来。下载地址配置加速拉取docker镜像$ docker pull gitlab/gitlab-ce以上ce是指社区版，这将会拉取社区版的最新镜像到本机。运行$ docker run -d -p 443:443 -p 8088:80 -p 222:22 \--name gitlab --restart always \-v /opt/module/gitlab/config

在很久以前，人们使用的电脑是可以通过一些按键直接控制比如寄存器等底层硬件设备的。这些按键所在的操作面板就是控制台（console）。简单的说那时候没有操作系统帮助你控制输入输出，控制寄存器内存，所以全是手动操作。后来为了不局限于距离（脑补的…），人们开始使用电缆去连接计算机，这时候电缆的开始端就是这台计算机，另一边当然就是终端（Terminal）。但终端只是个概念。具体的应该怎么去替代控制台的功能呢？早期人们使用的是电传打字机（Teletypewriter: TTY），也就是你可能输入一行 ls，就

今天犯了一个思维定式的错误，一直以为，渲染到element-ui表格中的数据中如果包含checked字段，那么当被选中的时候，就会设置为true。后来想想怎么可能呢…自己还debug了半天。实际上官方文档是这样的：其中，selection是选中的集合。而row是当前触发的那一条数据。显然你是直接得不到是否当前行是选中的这个状态。还需要遍历一下row.checked = false;selection.forEach(item => { if (item === row) { row.c

最近发现拯救者电脑卡成狗。自己想着不应该啊，这么高的配置，至于卸载电脑管家或者禁用启动项应该不至于影响到电脑卡顿。后来一阵摸索，发现发电源调成高性能就可以了。可能上一次使用时候没有插电源导致电量快耗尽了，隐约记得提示我进入节能模式。应该就这个这个模式导致的。点击windows图标 -> 点击左下侧齿轮样式的设置图标 -> 点击系统之后点击创建电源计划我这里自己创建了一个高性能的。所以可能比你的显示多出这个。然后选择高性能即可如上图所示，点击下一步然后按照提示输入确定即可。经过这

右键浏览器图标，点击属性，仅需要在目标里.exe后边添加参数"C:\Program Files\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir=D:\app\MyChromeDevUserData其中user-data-dir可以配置为你自己的任意目录。...

节流与防抖是老生常谈的话题…二者的区别总是搞不大清。今天用大白话解释下：二者都是在事件多次触发的时候。避免触发太多的回调函数。进而提高性能。比如输入框会监听用户的keyup事件，进而调用后台接口，返回数据。但如果输入太快太多，会频繁调用接口，导致接口压力比较大。。其实二者的根本区别是触发时机不同防抖是当事件不再触发的n秒后执行事件。假如你在输入框内持续输入，那么一次接口都不会调用，直到你不输入了，过了n秒，才调用接口。节流是当事件触发之后的n秒后才能再次触发。假如你仍旧持续输入，那么接口会按照n

有两种方式$ explorer .# 或者$ ii ..这个点是指当前的目录同样的，在mac的terminal中使用如下的命令可以打开$ open .

文章目录https简介证书购买配置证书注意事项https简介首先简单说一下https的原理。即服务端与客户端（浏览器）如何保证数据是加密传输的呢？我记得有个经典的例子：服务端发给客户端一个打开的锁和装数据的箱子客户端将数据放入并锁上箱子，然后发给服务端。很经典吧，但如果第一步服务端发给客户端的时候被黑客拦截了，并替换了黑客自己的箱子和锁。客户端是无法甄别的。所以在上述的过程中还需要对锁进行签名，即比如王麻子牌锁，客户端是是信任的。而其他牌子的锁，浏览器是会给予不安全的提示的。以上描述的加

话说wodpress官网要求php版本不低于7.3。特意尝试下在centos6.10中安装php7.3。分别安装 Remi，EPEL的yum存储库# epelyum install epel-release# remirpm -Uvh http://rpms.famillecollet.com/enterprise/remi-release-6.rpm紧接着安装php## 安装PHP 7.3$ yum --enablerepo=remi-php73 install php再安装其他

阿里云是可以修改root用户密码的。只不过修改需要重启实例。如果是忘记了普通用户的密码，可以以root的身份登录到阿里云账户。并执行：# user 是你要修改密码的用户$ passwd user若你配置了禁用密码登录，且禁用了root直接登陆。仍旧可以使用aliyun控制台提供的VNC来进行root登陆。之后再执行上述命令，修改普通用户的密码。最后，有些可以记录密码的软件，比如某宝里面就有。可以把密码记到里面，支持人脸识别，保证安全。总之好记性不如烂笔头。...

文章目录首先进入到找回账号的页面其次确认需要找回/释放/解冻的账号最后就是等待腾讯的审核了首先值得注意的是，如果是想删除、释放公众号，也需要先找回。可以参考官方文档首先进入到找回账号的页面其次确认需要找回/释放/解冻的账号找到原始ID以及后续提交个人资料的操作方法由于涉及隐私，我这里就使用文字描述了，整个过程也很简单：用你当时绑定的个人微信号扫描登陆的二维码，之后公众平台安全助手会提示你“刚刚登陆了已经冻结的账号”，查看公众平台安全助手底部的菜单栏会看到绑定查询，之后选择需要找回的公

在js中，对象属性有两种，一种数据属性，一种存取属性。为什么会有两种呢，我觉得是来源于实际情况。在实际生产开发当中，我们极少使用存取属性，所以如果定义对象还要通过set get 显然根麻烦。所以需要数据属性。而js考虑到对框架开发者的支持，比如vue需要劫持对象属性的存取操作，也很有必要用函数的形式存取数据来方便扩展。二者目的不同，但都是为了数据存取，所以二者不能同时使用。此外对于set get，一定是成对出现的，否则就会出现存了从来不用或用一个完全没有数据的数据，这是匪夷所思的，虽然单独定义一个可能宿主环