- 博客(53)
- 收藏
- 关注
原创 Git Bash的常用终端命令(不包括Git开头)
文章目录cd:进入目录ls:罗列当前目录下的文件和文件夹pwd:显示当前所在目录mkdir:创建文件夹touch:创建文件cp:拷贝文件mv:移动或重命名文件或文件夹rm:删除文件或文件夹cat:查看文件内容echo:将内容写入文件clear:清空当前窗口的记录reset:重置bash命令窗口信息exit:退出bash并关闭窗口在Git Bash中~代表当前用户目录/代表根目录.表示当前...
2019-12-04 21:11:08
859
原创 如何不通过iconfont项目向已有字体图标中添加新的字体图标
前言今天接到一个需求,要往项目中添加一个字体图标。按照以往的惯例,就是在iconfont网站的我的项目添加需要的字体图标就行了。但这个需求是个临时需求,不想用这种方式。于是,就想直接在现有的字体图标中添加。解决方案第一步在iconfont网站找到你需要的字体图标,将其添加到购物车中。然后,打开你的购物车,选择下载代码第二步解压下载的文件包,如图第三步将其中以eot/svg/t...
2019-11-29 17:27:24
3443
1
原创 MutationObserve的使用和应用
MutationObserve的使用和应用前言最近接到一个项目需求,就是把另一个项目嵌入到当前项目中。要求很简单,让人看不出这是嵌入过来的。本来觉得这也没什么,因为以前也做过一次。方案无非就是通过iframe嵌入,通过postMessage进行通信(ps:两个项目都是我们自己的,可以修改代码)。其他的一切都ok,就有个一个问题困扰了。我们当前的项目是一个典型的圣杯布局,头部和底部都要显...
2019-11-23 16:58:06
3569
原创 Git学习--09--如何删除指定的commit
场景最近不小心将一些暂时不需要合并的commit给合并到dev分支了,需要在dev分支上删除这些不需要的分支。解决方案使用git revert命令项目文件[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QWdNAIJT-1570973244922)(C:\Users\guzhao593\AppData\Roaming\Typora\typora-user-i...
2019-10-13 21:27:44
495
原创 Charles--01--安装和使用
文章目录前言安装和破解安装破解使用连接1. 电脑端连接2.手机端连接问题如何捕获本地`localhost`数据产生原因解决方法前言Charles是一款代理服务器,通过过将自己设置成系统(电脑或者浏览器)的网络访问代理服务器,然后截取请求和请求结果达到分析抓包的目的。其功能与Fiddler非常相似,个人觉得Charles更简洁。安装和破解安装进入官网下载地址:http://www.char...
2019-09-28 10:26:55
349
原创 JavaScript的执行机制
JavaScript的执行机制在理解JavaScript(以下简称js)的执行机制之前,先要理解几个概念:js是单线程语言为什么要将js设计为单线程,原因是js最初是专门为浏览器设计的。可以想象一下,如果js是多线程的,那么当你对同一个dom进行不同操作时,浏览器会不知道如何执行。比如,一个线程你要删除dom,另一个线程你要修改dom,同时给浏览器下达命令,这时浏览器该如何执行呢?...
2019-08-20 21:03:26
236
原创 JavaScript数据类型的转换
文章目录前言强制转换Number()String()Boolean()自动转换第一种情况,不同类型的数据互相运算。第二种情况,对非布尔值类型的数据求布尔值。第三种情况,对非数值类型的值使用一元运算符(即`+`和`-`)。自动转换为布尔值自动转换为字符串自动转换为数值前言关于JavaScript(以下简称js)的数据类型的转换,我们先来看以下几个例子。例1:const A = 1 + '1'...
2019-08-20 21:01:31
260
原创 前端如何实现文件下载功能
文章目录前端如何实现文件下载功能结合后端实现两种实现方式第一种、直接下载服务器的静态资源第二种、前端传参,后端生成文件实现思路:优缺点优点缺点纯前端实现数据来源实现思路第一步、将数据生成对应得`data:URLs`或`blob:URL`生成`data:URLs`生成`BlobURLs`第二步、处理下载(或叫导出)方式优缺点优点缺点前端如何实现文件下载功能对于如何实现文件下载功能,根据实现的技术...
2019-08-04 16:20:17
26649
2
原创 网站主题切换
文章目录网站主题切换前言思路全部写在`style`属性中全部写在外部`css`文件中引用不同的`link`文件通过`class`命名空间的方式`webpack`插件:`webpack-theme-color-replacer`实现`webpack-theme-color-replacer`网站主题切换前言关于网站主题的切换,其实也叫网站换肤。记得以前博客流行的时代,换肤很受欢迎。也在那时候...
2019-07-28 11:08:46
3977
8
原创 前端性能优化之Gzip
性能优化之Gzip什么是GZIP ?gzip是GNUzip的缩写,它是一个GNU自由软件的文件压缩程序。它是Jean-loupGailly和MarkAdler一起开发的。压缩原理Gzip 压缩背后的原理,是在一个文本文件中找出一些重复出现的字符串、临时替换它们,从而使整个文件变小。根据这个原理,文件中代码的重复率越高,那么压缩的效率就越高,使用 Gzip 的收益也就越大。反之亦然。文件...
2019-07-27 11:37:23
5355
1
原创 webpack进阶--02--多页面应用配置
项目文件结构:├─build├ ├─webpack.base.js├ ├─webpack.dev.js├ └─webapck.prod.js├─package.json├├─src └─views ├─admin ├ ├─index.js ├ └─index.html ...
2019-07-18 21:59:53
277
原创 webpack进阶--01--环境变量的设置
环境变量的设置在用webpack作为打包工具的项目中,环境变量共有三种:node运行时的环境变量webpack配置对象的环境变量js运行时的环境变量node运行时的环境变量在node环境中,通过process.env可以获取node的全局环境信息在windows系统中,可以通过执行以下命令设置:set NODE_ENV=dev在linux系统中,可以通过执行以下命令设置:...
2019-07-18 21:58:15
2444
原创 使用webpack打包的单页面项目如何设置favicon.icon文件
上一篇文章:如何给网站设置favicon.ico图标,介绍了favicon.ico是什么,怎么配置,有哪几种方式。但发现webpack打包的单页面项目却与普通项目不同,所以这篇文章介绍一下使用webpack打包的单页面项目如何设置favicon.icon文件第一种方式:放在根目录的实现首先,将favicon放在项目的根目录下然后:1、找到build下的webpack.dev.conf.j...
2019-06-28 10:05:30
7910
原创 如何给网站设置favicon.ico图标
favicon.ico是什么?所谓favicon,即Favorites Icon的缩写,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。favicon.ico是一个网站必要的吗?不是必要的,但是web服务器在网站加载时都会请求favicon.ico这个文件,如果不存在就会报404错误,并且会记录到错误日志中,所以最好的设置。favicon.ico怎么...
2019-06-28 10:04:23
55018
4
原创 前端项目发版后用户需要手动刷新页面获取的解决方案
背景我们的项目是后台管理系统,框架是Vue,构建工具是Webpack。问题每一次修改代码后打包发布到生产环境后,用户需要手动刷新才能获取到最新的代码。原因Webpack打包之后会根据文件内容生成一个hash值,然后再按照[name].[hash].js的格式生成文件名;然后再根据文件的路由对应关系生成一个runtime.[hash].js的文件,这个文件会监控浏览器的路由变化去服务器加...
2019-06-27 17:44:20
20388
原创 chrome中直接使用import
现在我们在开发项目时都是基于构建工具(像webpack)上进行开发,所以在使用import时得心应手。但今天在chrome中直接使用import时,发现不知道如何使用?chrome中直接使用import三个条件:浏览器版本需要支持,浏览器的支持情况:使用<script type="module">必须在服务器环境下才运行(可以通过全局下载npm包http-...
2019-06-22 19:23:34
5113
1
原创 编译知识
编译知识翻译程序翻译程序是一种程序,其输入是某种语言的一系列语句,而其输出则是另一种语言的一系列语句,二者在逻辑上是等价的。编译程序编译程序是一种程序。它把用高级语言写的源程序作为数据接收,经过翻译转换,产生面向机器的代码作为输出。这当中代码还可能要经过由汇编程序或装配程序作进一步加工,得出目标程序,交给计算机执行。两者的区别翻译程序是将一种语言转化为另一种语言编译程序是将一种语言转...
2019-05-31 21:00:45
1433
原创 Git学习--08--如何使用Git删除新增的文件?
需求今天提交代码时发现有一些新增的文件是不需要提交的,但又比较多,不想手工去删除。解决方案百度和实践了一波,总结有两个解决方案使用git clean删除git clean的作用就是清除未track的文件或文件夹, 主要有以下几个用法git clean -n 使用此命令将会显示将要删除的文件(注:但如果是新增的文件夹,则不会显示,包括这个文件夹下的文件也不会显示)git cle...
2019-05-05 20:11:52
8862
2
原创 Vue进阶--01--vm.$scopedSlots和vm.$slots的理解和基本使用
官方定义vm.$slots类型:{[name: string]: ?Array<VNode>}只读详细:用来访问被插槽分发的的内容。每个具名插槽有其相应的属性。default属性包括了所有没有被包含在具名插槽中的节点或v-slot:default的内容在使用渲染函数书写一个组件时,访问vm.slots最有帮助。vm.$scopedSlots类型:{[...
2019-04-11 20:25:32
19922
6
转载 语义化版本(SemVer)的范围
转自 http://www.u396.com/semver-range.html在使用 Node.js 和 Bower 的时候,其中的 package.json 和 bower.json 都会有 dependencies、devDependencies 项,对于此前端开 发的童鞋应该会比较熟悉。这里面是运行时和开发时依赖库,其中依赖库对应的版本号有很多种写法,诸如:”~1.0.2“, “^1.0...
2019-04-01 14:32:50
1017
原创 敏捷开发的实施步骤
1. 挑选一位产品负责人这个人必须知道带领的团队需要做什么、制造什么产品以及取得什么成果,必须会面考虑到风险与回报、什么具有可行性、什么能做以及他们对什么富有热情。2. 挑选一个团队真正做事的是谁?这个团队必须能够落实产品负责人的愿景。团队规模宜小不宜大,一般3~9人较为合适。3. 挑选Scrum主管主管为Scrum过程负责,负责培训团队其他成员,确保Scrum得到正确运用,帮助团队消除...
2019-03-21 22:07:42
8423
原创 《敏捷革命》读书笔记
第一章 世界的动作方式已经打破要点:规划是有用的,而盲目遵循规划则是愚蠢的。将所有项目所需要的工作进行规则并完全遵循,则当现实情况与预计情况不同,则会慢慢走向失败。所以任何规划都都需要根据实际情况而即时调整。检查与调整每过一小段时间就要检查一下已经完成了哪些任务,看看这些任务是不是自己应该做的,看看还有没有更好的方法。要么改变,要么倒闭固守老派的工作方式、过于注重“命令...
2019-03-21 21:11:21
2410
1
原创 物联网理解
物联网概念物联网就是物物相连的互联网。(英文名:Internet of things,简称:IoT)两层意思:物联网的核心和基础仍然是互联网,是在互联网基础上的延伸和扩展的网络其用户延伸和扩展到了任务物品与物品之间,进行信息交换和通信,也就是物物相息。物联网通过智能感知、识别技术与普适计算等通信感知技术,广泛应用于网络的融合中,也因此被称为计算机、互联网之后世界信息产业发展的第三次...
2019-02-18 21:07:56
7133
1
原创 Git学习--07--批量删除分支
文章目录需求解决方案1. 删除分支命令2. 命令解释3. 管道命令与`xargs`命令的区别实例删除本地分支中包含`Hotfix`的分支执行命令执行结果注意事项需求因为我们项目的GIT工作流是一个任务或一个Bug单独拉一个分支,完成之后再MergeRuquest到开发主分支。时间一长,就导致本地有大量的GIT分支。虽然并没有太大的影响,但GIT会经常提示垃圾回收(git gc)。解决方案1...
2019-01-23 16:51:58
2436
1
原创 javascript中的对象属性迭代
创建案例对象先通过继承来创建对象:function Parent (name, age) { this.name = name || 'parent' this.age = age || 60}function Self (name, age, gender) { Parent.call(this, name, age) this.gender = gender...
2019-01-16 20:52:32
3329
原创 DOM事件的删除
DOM事件的删除根据事件处理程序的分类有两种DOM0级事件处理程序的事件删除监听事件element.onclick = function () {}删除事件element.onclick = nullDOM2级事件处理程序的事件删除DOM2级的事件删除,必须保证删除的事件函数与监听的事件函数是同一函数,也就是说指针是一样。所以DOM2级的事件处理函数必须是命...
2019-01-09 09:27:27
2698
原创 vue-cli3出现Invalid Host header的解决方案
发现场景最近用vue-cli3搭建了一个项目,结果一运行不停的报错,报错信息如下:Invalid Host/Origin header而且同时还发现另外一个问题,就是热更新也失效了产生原因新版的webpack-dev-server增加了安全验证,默认检查hostname,如果hostname不是配置内的,将中断访问。解决方案在根目录下创建文件vue.config.js,然后填入如下...
2019-01-06 11:45:36
27899
1
原创 Git学习--06--提交记住用户名和密码
问题最近重装了电脑,发现每次提交代码到远程仓库时都要输入用户名和密码。解决方案GIT有两种方式记住用户名和密码永久记住密码git config --global credential.helper store会在用户主目录的.gitconfig文件中生成下面的配置。[credential] helper = store如果没有--global,则在当前项目下的.git/c...
2018-12-27 22:27:14
1464
原创 理解getBoundClientRect()
概念getBoundingClientRect用于获取某个元素相对于视窗的位置集合。集合中有top, right, bottom, left等属性。用法语法:这个方法没有参数。rectObject = object.getBoundingClientRect();object就是当前元素返回值类型:rectObject.top:元素上边到视窗上边的距离;rectObjec...
2018-12-27 15:25:48
7796
原创 npm--05--查看npm包信息
第一种:查看任何npm包信息如果你想查看一个npm包的信息:npm view package_name就会输出这个npm包的基本信息,例:npm view z-message// 输出如下信息{ name: 'z-message', 'dist-tags': { latest: '0.4.4' },// 最新版本号 versions: [ '0.1.0', '0.2.0', ...
2018-12-09 18:51:55
2443
原创 npm--04--安装指定版本的依赖包
安装最新版本默认情况下,使用:npm install package_name执行上面命令后会安装最新版本npm包,等同于:npm install package_name@latest安装指定版本npm install package_name@[指定版本号]例:npm install npm@6.4.1安装未来版本npm install package_n...
2018-12-09 18:51:01
7085
原创 npm--03--锁定依赖包的版本号
需求上次去客户公司交接项目源代码时,出现安装依赖后,启动失败的问题,最后找到原因是有一个依赖包更新了大版本,导致两个文件找不到。所以客户要求我们要锁定依赖包的版本号,保证项目在以后的任何时间都正常运行。解决方案第一种、使用npm shrinkwrap命令使用npm shrinkwrap命令,生成npm-shrinkwrap.json文件,这样在执行npm install时,npm会首先检查...
2018-12-09 18:49:55
2937
原创 npm--02--开发依赖和生产依赖
开发依赖:devDependencies开发环境依赖,仅次于dependencies的使用频率!它的对象定义和dependencies一样,只不过它里面的包只用于开发环境,不用于生产环境,这些包通常是单元测试或者打包工具等,例如gulp, grunt, webpack, moca, coffee等安装命令:npm install package-name --save-dev或npm i...
2018-12-09 18:43:05
7525
原创 npm--01--依赖包版本号管理
打开项目的package.json文件,我们会发现我们的依赖包版本号前面会出现~、^、*符号,这代表什么意思:~ 会匹配最近的小版本依赖包,比如~1.2.3会匹配所有1.2.x版本,但是不包括1.3.0^ 会匹配最新的大版本依赖包,比如^1.2.3会匹配所有1.x.x的包,包括1.3.0,但是不包括2.0.0* 这意味着安装最新版本的依赖包所以在项目中,一般我们使用~,只会修复版本的b...
2018-12-09 18:41:41
349
原创 Git学习--05--拉取远程仓库指定分支代码
问题最近新开了一个需求分支,需求的开发时间比较长,为了保持与主分支的代码同步,所以我每次push之前都会先拉取主分支的代码。解决方案git pull的完整语法格式是:$ git pull &lt;远程库名&gt; &lt;远程分支名&gt;:&lt;本地分支名&gt;默认情况下,如果我们的本地分支名与远程分支名是一样的,且已经建立追踪,直接使用$ git pull如果本地分支名与...
2018-12-05 09:48:47
5566
原创 cordova不是内部或外部命令的解决方案
问题今天安装用npm全局安装cordova,再执行cordova命令时,出现"cordova不是内部或外部命令"。觉得挺奇怪的,然后发现,之前使用npm全局安装的npm包都不能使用全局命令了,像cnpm、http-server。原因其实原因很简单,就是未配置环境变量,所以系统找不到命令的执行文件。解决方案找到系统npm的安装路径,比如:上面就是我电脑npm的路径,从上图也可以看到我们...
2018-12-04 13:49:56
6257
原创 Git错误--git remote: HTTP Basic: Access denied
问题早上修改了公司gitlab的密码,然后再去拉取代码时,就出现了:remote: HTTP Basic: Access deniedfatal: Authentication failed for 'http://gitlab.***.com/***.git/'原因很明显,就是远程服务端的用户名和密码与当前系统中git保存的用户名和密码有冲突解决方案在操作系统中以管理员身份打...
2018-12-03 09:41:39
46861
7
转载 git merge使用不当引发的代码丢失血案
背景几年前大批量的团队都在转用git,git的本地库和分支特性让代码管理的便利性大大增加,也因为本地库和分支的大批量使用导致了代码之间的频繁merge,我们团队以前就有遇到过git merge以后丢代码的情况,表现就是某些变更开发A提交了,经过中间以序列的commit, merge,push,最终某些改动没了,去看commit history,也没有相应的变更记录。一次次commit对比以后总是...
2018-11-29 20:53:53
14711
4
原创 async/await的使用和理解
ES2017 标准引入了 async 函数,使得异步操作变得更加方便。首先我们要理解async函数的几个要点:返回值是Promise不管是否return,都会返回一个Promise对象。相当于执行:return Promise.resolve(value)// 如果函数没有return,则value是undefined使用了await命令,则一定要await后面的代码执行完...
2018-11-17 19:40:16
1364
原创 async/await函数的执行顺序的理解
最近遇到一个关于async函数使用的Bug,因代码涉及太多业务,所以模拟了代码, 如下:let testArr = [1, 2, 3]let flag = falseconst func = (res) => { return new Promise((resolve, reject) => { if (res) { resolve(res) }...
2018-11-17 18:36:29
5362
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人