Oliver尹的博客

本演示项目是基于fetch方式实现的流式对话效果，如果有小伙伴想要了解一下，那么可以下载试一下~

整理了最近的闲聊，话题是前端各个包管理器，如果分享的不对或者有异议的地方，麻烦请及时告诉我~耐心看完，也许你会有所收获~10-15分钟左右；初级，最好对Node有一个基础认知；通过本文，你能大致知道npm，pnpm，yarn这些包管理工具的介绍及一些常用命令；nrm；

本文先是具体分享了一些日常开发中可能遇到的性能优化点或者说是方法，难度：中级；

最近我司的小伙伴在项目上遇到一些问题，是关于性能上的，因此我们探讨了一些关于前端性能优化方法，因此有了本文～

近来项目中需要用到一个日历组件，由于找了找没有找到合适的，因此决定自己简单动手做一个，项目中肯定比这个复杂的多，这里只是给各个小伙伴一个思路或者说是开发的方向～

关于阿里云OSS服务器绑定域名及Https证书

主要实现的是在echarts中堆叠柱状图的 默认选中 以及 定时切换选中 效果；

本文主要实现的场景是，在任意一个窗口内首次打开指定页面时通过新建窗口的方式打开，在任意一个窗口内打开已打开的界面时，仅激活对应窗口，且对应窗口不刷新

记录分享一下vue中比较好用的一个瀑布流插件——vue-masonry，GitHub上将近600个star，个人推荐~

chrome插件开发时遇到了这么个问题，网页存在一个跨域的请求，在正常的运行web界面时是使用jsonp开发实现的，当打包成chrome插件后，安装进浏览器这个跨域请求竟然他瞄的报错了…

本文难度属于：初级，对尚未接触到小程序的朋友通过本文可以大致了解到 微信小程序是什么，如何开发一个微信小程序以及微信小程序的一些基本设置；

Vite，发音 **/vit/，**可以说是今年大火的一个**前端构建工具**，其实在推出1.0版本的时候就可以初步的看出其功能的强大，只不过一直仅限于关注一下的状态，并未主动尝试去了解学习，随着尤大的近来的一再推荐，甚至直言用了vite就再也回不去webpack了之后就彻底点燃了我的兴趣，好吧，我也要学习一下（PS：卷不动了，卷不动了，大佬们不要动不动就彻底新干一个东西出来了，来不及学.....）

本文主要讲述了在Vue3和TypeScript下如何实现一个简单的Button组件，以及当我们要实现这个组件需要在前期进行功能代码的设计，优秀的设计可以在前期将所有功能点都描述清楚......

干净代码的目的是为了编写可读且容易理解的代码，便于他人进行维护和接手，而设计模式等等的目的是为了编写可维护可扩展的代码，设计模式带来的代码不一定是干净代码，可能在可读性上会非常复杂，需要视情况而定；

在这一章节，则是要主要对代码深层嵌套的问题做一些分享和处理

不知有没有发现，很多优秀的开源项目往往具有代码结构清晰，注释完善，不管是其可阅读性，还是可扩展性都非常的厉害，让我非常羡慕，因此，如何写出干净、优秀的代码就是向大佬晋级的第一步；

不知有没有发现，很多优秀的开源项目往往具有代码结构清晰，注释完善，不管是其可阅读性，还是可扩展性都非常的厉害，让我非常羡慕，因此，如何写出干净、优秀的代码就是向大佬晋级的第一步；

在现代大前端领域中，换肤功能已经逐渐成为几乎所有应用的标配，尤其是暗夜模式被推广之后，皮肤功能就正式走到了大众的视野，同样，在web领域尤其是后台管理系统中皮肤功能也由此几乎成为了标配，恰好最近在做的东西同样要包含这样一套机制~

最近在参与年终的项目复盘，在代码部分看了几个项目的前端代码，发现UI框架都是使用的IView或者ElementUI，其中在表单部分的输入框这一块发现了一些关于校验方式可以进一步优化使用的问题....

我们可以像CSDN官方的Chrome插件一样，将起始页改写成Chrome插件，这样避免了没有域名也能使用的尴尬境地....

之前习惯使用的是百度的作为浏览器的首页，百度登录账号后可以在首页上收藏很多书签，但是近期因为使用不同电脑协同办公，导致一台电脑登录百度账号后，其它的电脑的百度会被提下线，这就很烦，还不如自己做个起始页；

弹窗拖动，一个相对比较常用的功能，现在的后台管理系统UI框架基本上不是IView就是Element，且这两者都有其自带的基础组件：弹窗组件，但是从需求的角度出发，这两者的弹窗组件其实都不能满足业务的开发，本文讲述如何使用自定义指令实现可拖动弹窗.....

《Axios》axios的初识与摘要Axios简介官方描述：Axios，基于 Promise 的 HTTP 客户端，可以工作于浏览器中，也可以在 node.js 中使用。本质上讲，也是对XHR进行了封装，不同的是axios使用Promise实现的，因此更符合ES规范；Vue毫无疑问，大火，并且Vue 2.0之后，明确表示不再维护vue-resource，改而推荐使用Axios，从此Axios加入了Vue全家桶；优点和Fetch相比，兼容性好的多，Fetch由于是采用的新技术，而不是对XMLHtt

VueX的设计及使用简介VueX时一个专为Vue.js应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件状态，并以相应的规则，保证状态以一种可预测的方式发生变化；换句话说，Vuex采用类似全局对象的形式来管理所有组件的公共数据，如果想修改这个全局对象的数据，得按照Vuex提供的方式来修改，不能随意用自己的方式修改；（通俗点讲：创建了一个集中的数据存储的store，这个store挂载在顶层的Vue上面，正因为挂载的地方是顶层，所以创建的所有组件都是其子组件，也因此所有的组件都可以访问这个st

前言我所在的公司一直是使用svn作为版本管理工具，因此我没有接触过git，但是不管如何git作为目前大火的版本管理工具，了解并掌握是很有必要的，因为你不能确定下一家公司使用的是svn还是git作为版本管理；定个小目标，静下心来好好学习git，使用新知识重构个人网站，并使用git作为版本管理工具；简介简单的说，就是一个版本管理工具，其作用就是管理不同的代码版本，以便如果出现问题，可以回溯，并且多人协同开发等等也是十分的方便，简而言之，就是相当好，如果你想对git的简介有更多的了解，请看廖老师的描写的部

前言只要是项目，绕不开的就是组件的封装和复用，虽然现在有很多前端的UI库，比如Element等等，但是这些UI库很多是基于最小颗粒度做的组件，实际项目中往往需要将多个基础组件封装在一个大组件里，举个例子，标题栏，在后台管理系统中往往一个标题栏包含了：标题，返回按钮，有时还有会新增，或者用于切换的按钮组;组件设计思路组件的封装不是一开始就可以随便封装的，因为组件的迭代会影响到之后的所有使用的页面的正常与否，因此，对于组件的封装需要仔细斟酌，不必要的组件封装有时候会成为后期维护的包袱；因此，第一个页面

前言承接上一篇《入门小程序》，希望通过这个简单的商城demo可以更好的学习并理解微信小程序的开发；（PS：本文接口和图片资源来自于某位老师的网课，为了防止说打广告，因此不放链接了，布局和实现这两部分与课程不尽相同，虽然是学习但是学习还是要融入自己的思考才能有所收货，因此只能说最终效果是一致的）；分析在开始码代码前我个人习惯先分析一下接下来要做什么，理一下逻辑，同时看看有可能会涉及到哪些知识点，这样在准备阶段大致心里就有了一个底，对于重复度高的部分可以提前预计到并封装成组件，公共样式也尽量提前抽离，不

前言微信小程序的火爆相信不用多说，作为一个前端，小程序几乎可以算得上是前端技能的一个加分项，如果找工作的时候会小程序，那么相对而言会有很多优势；简介官方解释：小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。简单的说，小程序就像是微信的一个功能插件，这个功能插件可以无缝的接入微信，让用户在微信中使用小程序时获得接近原生app的体验；官方地址：小程序开发者文档，通过阅读简介，对于小程序其实可以理解成，微信为了更好的为用户提供使用体验，它对JavaScri

《HTTP》初识与摘要基础知识HTTPHTTP，是Hyper Text Transfer ProTocol的简写，中文名叫做：超文本传输协议，是实现了web服务器和客户端之间的通信，是互联网上最广泛的通讯协议，换句话说，就是平台访问网页，请求信息，提交表单等等都是通过的http协议；HTTP的每一个请求都是独立的，相互之间没有办法获取信息，或者说是没有办法存储状态，在实际情况中，登录前和登录后，开通会员和未开通会员等等这些状态对网页产生的影响明显不同，因此为了存储状态以便有更好的用户体验便有了：Co

前言Vue3目前已经正式进入beta版本了，相信再过不久正式版即将上线，Vue3相对于Vue2版本变化还是很大的，某种程度上而言几乎重写了的感觉，因此继续努力吧…安装想要新建安装Vue3项目，对于vue-cli也就是脚手架的版本是有要求的，至少要求@vue/cli的版本在4.3.1以上，如果版本不是，那么建议直接更新到最新，可以通过以下命令更新脚手架//以mac为例sudo npm install -g @vue/cli之后就是正常的新建一个名为demo的项目vue create demo

前言本文衔接《彻底入门webpack》，主要记录了环境配置，代理等功能，并希望能进一步了解loader的实现原理，希望能有所收货；环境概述环境主要分为：开发模式和生产模式，在不同的场景下可能需要不同的配置，使用不同的功能，所以要区分环境**开发模式：**会额外的用到一些调试功能，比如webpack-dev-server，source-map，代码风格检查，但为了加快调试速度，可能不会用上压缩等；**生产模式：**项目上线即将上线了，因此打包的重点是减少文件体积，图片压缩，转base64，提取公

前言前端发展到今天已经从当初简单的几个网页发展到更多的是把网页视为WebApp的模式，当业务逻辑复杂到一定程度的时候，就不得不考虑项目的可维护性，项目的多人协同，如何降低风险等等诸多问题；试想一下，一个网站如果仅有几个展示页面，那么其实不管怎么写都没有什么问题，但是一旦页面有几十，上百，或者说虽然只有十几个页面，但是有N多个功能模块，那么还是一通写到哪算哪，那么问题就大了，一旦业务需求变了，改都甚至不知道从哪里开始改，又或者说不知道改了会不会对别的功能产生影响，因此前端工程化就应运而生；简介概述w

前言在如今的前端行业，选择一门框架进行开发不仅仅能大幅提升开发效率而且可以更好的使得项目方便管理，维护，而前端框架中主流的则分为：React，Angular和Vue，其中Vue在这两年发展的非常快，据2019年的统计，前端工具使用中，仅次于React和Jquery，因为为了更好的学习Vue，特此作为学习记录，本文基于vue2，因此文中的信息不涉及vue3的内容，vue3也是基于2的版本上进行的更迭，使用上不会有大的变动。什么是Vue？官网的解释是：一套用于构建用户界面，以数据驱动的渐进式框架，我理解的

作用正则的主要作用：校验，匹配，替换；创建直接量创建，例如：let reg = / parttern / attrs;对象创建，例如：let reg = new RegExp ( parttern , attrs );注意：parttern是一个字符串，这个字符串比较特殊，代表了某些规则，通过这些规则可以用来检查某一串字符中是否包含与规则相匹配的内容，attrs是一个修饰符，这个修饰符代表了前面规则的匹配模式；规则在了解规则之前，谨记，正则其实很笨，它去匹配内容的时候，只会一位一位的去对被

前言为了更好的学习vue，源码的学习肯定是必不可少的，阅读源码可以更好的理解vue的运行机制，使得使用的时候可以更加得心应手，另外也可以学习编码规范和代码风格，好的规范、好的风格往往可以使得效率翻倍；注1：本文分析的源码基于Vue版本2.5.1，因为不同版本的生命周期函数可能有所差异，但原理差不多；概述生命周期，vue的核心概念之一，官方解释：每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过