自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

开心大表哥

在前端大神的道路上越走越远

  • 博客(177)
  • 资源 (18)
  • 论坛 (1)
  • 收藏
  • 关注

原创 vue-cli4.0+nodejs多个项目共用组件动态打包单个项目

前言:公司经常会有一些活动,为了配合活动开发人员需要开发一些h5页面来配合活动,刚开始活动不多,所有活动页面都放在一个项目目录下,webpack共用一个固定打包入口,对路由(vue-router)和状态管理(vuex)进行模块划分,不同的活动页面通过不同的路由路径来加载。随着活动项目增多,页面也越来越多,问题就就出现了,比如打包projectA,webpack也会把projectB,proje...

2019-12-21 21:28:07 1474

原创 全栈式开发,前端工程化,以nodejs,eggjs为服务器语言,mysql为数据库,vue,vuex,wangeditor,i18n,webpack前端架构服务器端渲染ssr支持seo的博客网站

前言下面介绍本人开发的个人博客,希望通过开源的方式一起学习和进步!1. 背景该项目为一个学习型的博客网站案例,毕竟每个it工程师都想有一个自己的博客嘛,适合初中级前端工程师;项目已经部署在阿里云上,已经比较完整了,本地下载代码和安装好对应的环境,运行即可以获得线上的效果。由于项目涉及到服务器端而且用了数据库作为存储工具,架构用了eggjs和easywebpack所以首次运行的步骤比较繁琐,还...

2019-05-29 19:35:20 531 2

原创 从0到1架构webpack+vue前端项目,你自己搭建过vue开发环境吗

前言:作为一个小白,我们经常会迷惘webpack+vue项目究竟要怎样的呢?本次的文章就是为了解答这个问题的,跟着本文的思路你可以很轻易和明白一个简单的webpack+vue项目是怎样构建和运行起来的。源码地址成果图: 图中左边是项目效果,右边是源码。 下载源码后 1.安装必要的组件:npm ii是install的简写啦,我一不小心又开始装B了。。。。2.运行项目...

2018-07-07 00:06:04 2117 9

原创 react入门-由vue到react开发的历程

待续

2019-09-30 09:38:59 294 1

原创 gitlab-ci前端在阿里云实现nodejs可持续化集成部署

前言不甘心当一个切图仔,所以什么都要学一下;可持续化集成是一个项目工程架构的问题;但在这篇文章中我将它缩小到了前端的领域内。必要条件一台阿里云服务器-2核4G以上(我的心好痛800大洋)技术栈linux操作基础git/github/gitlabnodejs环境基础步骤...

2019-07-04 15:47:07 1278 1

原创 vue源码分析系列:用sourcemap调试源码

由于前几篇文章是用vue-cli直接分析的,今天我们学习直接调试vue源码。安装vue(mac机)1.在GitHub上克隆官方的vue-地址2.安装依赖npm install修改vue项目1.在package.json script dev 增加--sourcemap指令"dev": "rollup -w -c scripts/config.js --environment TARGE...

2019-06-12 11:49:36 5593 5

原创 vue源码分析系列四:createElement和update

createElementVue.js 利用 createElement 方法创建 VNode,它定义在 src/core/vdom/create-elemenet.js 中:// wrapper function for providing a more flexible interface// without getting yelled at by flowexport functi...

2019-06-10 16:18:22 688

原创 vue源码分析系列三:render的执行过程和Virtual DOM的产生

render手写 render 函数,仔细观察下面这段代码,试想一下这里的 createElement 参数是什么 。new Vue({ el: '#application', render(createElement) { return createElement('div', { attrs: { id...

2019-06-06 13:50:19 227

原创 vue源码分析系列二:$mount()和new Watcher()的执行过程

续vue源码分析系列一:new Vue的初始化过程在initMixin()里面调用了$mount()if (vm.$options.el) { vm.$mount(vm.$options.el);// 挂载dom元素}$mount()方法定义vm的原型上本身就定义了一个$mount(如下所示),然后通过重写$mount方法,最后返回的时候,调用这个缓存$mount方法。//...

2019-06-05 10:18:56 590

原创 vue源码分析系列一:new Vue的初始化过程

import Vue from ‘vue’(作者用的vue-cli一键生成)node环境下import Vue from 'vue'的作用是什么意思?在 NPM 包的 dist/ 目录你将会找到很多不同的 Vue.js 构建版本。这里列出了它们之间的差别:具体参考:官网完整版:同时包含编译器和运行时的版本。编译器:用来将模板字符串编译成为 JavaScript 渲染函数的代码。运行时...

2019-06-04 10:50:25 1519 1

原创 详细理解重绘与回流/重排的过程

前言:重绘与回流是由于浏览器的再次渲染所引起的一个话题,所以我们需要先了解浏览器的渲染过程;一个前端页面无非就是有hmtl、css、JavaScript组成的。通常来说,渲染引擎会解析HTML文档来构建DOM树,与此同时,渲染引擎也会用CSS解析器解析CSS文档构建CSSOM树。接下来,DOM树和CSSOM树关联起来构成渲染树(RenderTree),这一过程称为Attachment。然后浏览...

2019-05-21 10:53:59 1411

原创 vue使用moment.js经webpack打包后超级大的原因和解决方案

Moment.js 是一个 JavaScript 日期处理类库,用于解析、检验、操作、以及显示日期,使用起来十分方便。但是它经过webpack打包之后会变得十分的大。我们做一下对比:测试版本:“moment”: “^2.17.1”,没import moment from 'moment';前webpack打出来的index.js包:js/chunk/index/index.eb9cbc...

2019-01-29 15:34:21 3817 3

原创 阿里云轻量应用服务器实例id找不到无法备案

阿里云轻量应用服务器实例id找不到无法备案最近买了一个轻量应用服务器,做了一个个人网站,感觉做得不错,所以想将域名备案了,增加百度排名。于是去备案:结果找不到实例id。谷歌、百度很久都找不到答案;最终只能打电话问客服了。阿里云客服给出来的答案是我买的是香港的服务器;想要备案只能是中国大陆的原来买的服务器不能转换地域,所以我只能重新买一个中国大陆的服务器了(mmp)。...

2019-01-06 10:33:22 3627 9

原创 linux移动文件到另一个文件夹

复制指定目录下的全部文件到另一个目录中1.文件及目录的复制是经常要用到的。linux下进行复制的命令为cp。假设复制源目录 为 dir1 ,目标目录为dir2。怎样才能将dir1下所有文件复制到dir2下了如果dir2目录不存在,则可以直接使用cp -r dir1 dir2即可。如果dir2目录已存在,则需要使用cp -r dir1/. dir2例:// 没有publicData...

2018-12-25 17:30:12 16296 2

原创 支付宝小程序跳转到h5页面web-view

支付宝小程序跳转到h5页面web-view基础库 1.6.0 开始支持,低版本需做兼容 组件是一个可以用来承载H5网页的组件,会自动铺满整个小程序页面。web-view 要渲染的H5网页URL。H5网页URL需要登录小程序管理后台-小程序详细-设置中,进行H5域名白名单配置示例代码:<!-- axml --><!-- 指向支付宝首页的web-view -->&...

2018-12-25 15:10:03 16874 1

原创 支付宝小程序复制到剪贴板

支付宝小程序复制到剪贴板my.getClipboard获取剪贴板数据。Page({ data: { text: '3.1415926', copy: '', }, handlePaste() { my.getClipboard({ success: ({ text }) => { this.setData({ cop...

2018-12-25 13:50:50 1536

原创 nodejs egg多静态文件入口配置

由于egg多静态资源入口在一开始的时候是没有的,是后来增加的;但是文档写得不是太清楚所以小白不容易弄懂。在config.default.js文件中增加这个,将项目根目录下的public、publicData这两个文件夹作为静态资源入口;运行的时候egg会将这两个文件夹的资源放到prefix: '/public/'配置的/public路径下。 exports.static = { pr...

2018-12-19 08:03:08 3831 2

原创 Mac上传文件到阿里云的Linux服务器,linux下载文件到Mac,unzip/zip压缩和解压文件

1.打开默认终端,左上角选择新建远程连接2.选择安全文件传输(sftp)2.1.点击右边服务器下的加号添加你要连接的远程服务器ip地址2.2.添加成功后右边服务器列表会出现你新加的这个ip地址,然后选中它;点击连接。3.首次连接一个服务器会让你确认(Are you sure you want to continute connecting(yes/no)),你输入yes然后回车就可以...

2018-12-17 15:47:16 2964 2

原创 阿里云部署nodejs,公网访问不了,域名不加端口号访问

背景:我买的阿里云服务器是香港的CentOS 7.3(便宜)已成功安装了nodejs操作:1.新建项目文件example.jscd ~touch example.js2.编辑example.js文件vi example.js2.1.输入i,进入编辑模式,将下面代码(简单的nodejs创建服务代码)粘贴到文件中。使用Esc按钮,退出编辑模式,输入:wq,回车,保存文件内容并退出...

2018-12-17 13:44:10 2290

原创 nodejs连接mysql报错:Client does not support authentication protocol requested by server; consider upgrad

由于本人是前端,mysql只是偶尔做一下小项目会用到,大概一年没有用了。 今天用mac通过brew下载了一个8.0.12版本的mysql;然后用egg进行连接,egg是阿里封装的一个nodejs框架。 下载到本地的mysql;初始密码我是留空的。所以在nodejs项目中配置mysql连接数据的时候我的password=’’;结果报错了:Client does not support authe...

2018-11-28 17:45:08 2897 3

原创 vue elementUi tree 懒加载使用详情

背景:vue下使用elementUI文档:http://element-cn.eleme.io/#/zh-CN/component/tree#tree-shu-xing-kong-jian需求:只保存二级节点中选中的数据;不保存一级节点选中的数据。效果:数据来源:后台提供两个接口分别用于取第一级节点和第二级节点的数据;思路:点击标签列表时,触发selectLabelList获...

2018-11-21 11:17:04 20536 4

原创 MAC设置环境变量PATH和alias创建快捷键

Mac系统的环境变量,是由下面这几个个文件共同控制的,优先顺序为:/etc/profile /etc/paths ~/.bash_profile ~/.bash_login ~/.profile ~/.bashrc/etc/profile和/etc/paths是系统级别的,系统启动就会加载,后面几个是当前用户级的环境变量。后面3个按照从前往后的顺序读取,如果/.bash_profile文件存在...

2018-11-20 19:12:04 1143

原创 推荐一个十分实用的VUE瀑布流插件Masonry

Masonry是最流行的瀑布流插件之一,配置简单,功能强大,在Github上收获了1.3w+ stars。如果你想使用瀑布流提升网站体验,Masonry将是不错的选择。啥是瀑布流:是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部。最早采用此布局的网站是Pinterest,逐渐在国内流行开来。国内大多数清新站基本为这...

2018-11-08 11:53:08 16677 8

原创 快应用快速开发攻略和踩坑讲解

快应用是什么:快应用是基于手机硬件平台的新型应用形态;标准是由主流手机厂商组成的快应用联盟联合制定;快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台;以平台化的生态模式对个人开发者和企业开发者全品类开放。优势:无需安装 即点即用-流畅;能添加到桌面;区别于原生App和WebApp;超6亿流量扶持;大势所趋。存在问题:需要申请九大厂商开发者账号,每个账号需要...

2018-11-07 15:11:33 585 2

原创 js将带有日期格式的数组对象按时间降序重新排列,最后打印数组对象的日期

需求:后台将一个带有日期格式(不是时间戳)的数组对象给到前端,前端打印这个数组对象的日期时需要按时间降序排列思路:1.先将对象中的日期字段变成时间戳,然后通过sort()来排序,接着将对象中的时间戳变成日期; 2.先给对象增加一个字段publishTimeNew,用来保存时间戳;然后通过sort()来排序publishTimeNew虽然第二种思路多增加了一个publishTimeNew字段占...

2018-10-30 18:01:10 8365 3

原创 js获取富文本中的第一张图片url正则公式及去除字符串里面的html标签的正则公式

js获取富文本中的第一张图片url正则公式及去除字符串里面的html标签后台发来一个富文本字符串里面可能包含了0、1、2、3…图片标签(img),我们的任务是获取这个字符串里面第一张图片的url,如果没有图片则放回空var imgUrlFun = function(str){ var data = ''; str.replace(/<img [^&...

2018-10-30 13:51:25 4400 2

原创 前端算法:给定一个整数数组和一个目标值,找出数组中和为目标值的两个数、判断一个整数是否是回文数

<!--给定一个整数数组和一个目标值,找出数组中和为目标值的两个数。你可以假设每个输入只对应一种答案,且同样的元素不能被重复利用。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]@link https://leetcode-cn.com/problems/tw...

2018-10-24 11:12:55 730 2

原创 解析url中的#、&、?的作用和意义

twitter改版,一个显著变化,就是URL加入了"#!"符号。比如,改版前的用户主页网址为http://twitter.com/username改版后,就变成了http://twitter.com/#!/username这是主流网站第一次将"#"大规模用于重要URL中。这表明井号(Hash)的作用正在被重新认识。本文根据HttpWa

2018-10-11 15:36:15 2484

原创 js获取url地址中的每一个参数,方便操作url的hash及正则表达式的方式获取在url上参数

js获取url地址中的每一个参数,方便操作url的hash值得收藏<html> <body> <script> //location.search; //可获取浏览器当前访问的url中"?"符后的字串 function parseURL(url) {

2018-10-11 15:32:26 4370

原创 JavaScript引擎运行原理解析

1. 什么是JavaScript解析引擎?简单地说,JavaScript解析引擎就是能够“读懂”JavaScript代码,并准确地给出代码运行结果的一段程序。比方说,当你写了 var a = 1 + 1; 这样一段代码,JavaScript引擎做的事情就是看懂(解析)你这段代码,并且将a的值变为2。“JavaScript 引擎”通常被称作一种虚拟机。JavaScript 虚拟机是一种进程虚拟...

2018-09-30 10:16:41 3250

原创 正则表达式的高阶使用技巧

零宽断言:零宽断言是正则表达式的一种方法,用于查找在某些内容(但并不包括这些内容)之前或者之后的东西,也就是说他们像\b(匹配一个单词边界,也就是单词和空格间的位置,正则表达式的匹配有两种概念,一种是匹配字符,一种是匹配位置,这里的\b就是匹配位置,例如,“er\b”可以匹配“never”中的“er”,但不能匹配“verb”中的“er”),^(匹配输入字行首),$(匹配输入字行尾)那样用于指定一...

2018-09-26 15:30:15 713

原创 Mac设置别名alias和全局变量

设置.bash_profile1.打开终端Terminal2.输入命令cd ~到用户主目录cd ~3.用vim编辑.bash_profile文件vim .bash_profile或者直接打开再编辑: open -e .bash_profile如果没有.bash_profile文件就要先创建:touch .bash_profile4.增加alias:alias wepy...

2018-09-25 15:07:20 2621

原创 抓包神器charles使用与破解实战

简介:charles是一个HTTP代理服务器,HTTP监视器,反转代理服务器,当浏览器连接Charles的代理访问互联网时,Charles可以监控浏览器发送和接收的所有数据。它允许一个开发者查看所有连接互联网的HTTP通信,这些包括request, response和HTTP headers (包含cookies与caching信息)。主要功能:支持SSL代理。可以截取分析SSL的请求。支...

2018-09-19 15:39:05 1645 2

原创 ES6中class的getter和setter在继承中踩坑

在 Class 内部可以使用get和set关键字, 对某个属性设置存值函数和取值函数, 拦截该属性的存取行为。在 Class 内部的get、set用法,看起来比较舒服,而且可以写同名函数了。class MyClass { constructor() {} get prop() { return 'getter'; } set prop(value) { console.log(...

2018-09-19 15:19:45 4127 1

原创 解读es6 class 中 constructor 方法 和 super 的作用

ES6 的 class 属于一种“语法糖”,所以只是写法更加优雅,更加像面对对象的编程,其思想和 ES5 是一致的。类和模块的内部,默认就是严格模式,所以不需要使用use strict指定运行模式。//定义类class Point { constructor(x, y) { this.x = x; this.y = y; } toString() { r...

2018-09-19 15:06:34 8596 6

原创 js通过UA判断ios、android、微信、qq、qq浏览器

function isIPhone(){ //判断是否是ios var u = navigator.userAgent; var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 return isIOS; }var ua = navigator.userAgent.toLowerCase();...

2018-09-19 11:15:13 2790

原创 多个贝塞尔曲线在同一个animate动画中的实践

贝塞尔曲线(Bézier curve):又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线,贝兹曲线由线段与节点组成,节点是可拖动的支点,线段像可伸缩的皮筋,我们在绘图工具上看到的钢笔工具就是来做这种矢量曲线的。贝塞尔曲线是计算机图形学中相当重要的参数曲线,在一些比较成熟的位图软件中也有贝塞尔曲线工具,如PhotoShop等。在Flash4中还没...

2018-09-19 10:59:49 947

原创 css3鼠标点击出现波浪动态效果案例现场

(function() { let x, y; let index = 0; let screenSizeWidth = (′body′).width();letscreenSizeHeight=(′body′).width();letscre...

2018-09-13 10:51:50 2956 6

原创 用benchmark测试es6的extends属性的性能

用benchmark测试es6的extends属性的性能新建一个文件叫classExtend.js放以下代码:'use strict';const Benchmark = require('benchmark');const benchmarks = require('beautify-benchmark');const suite = new Benchmark.Suite();...

2018-08-27 22:26:43 231 1

原创 谷歌浏览器扩展程序一键解决本地开发跨域问题,让你不用乱mock数据

谷歌浏览器扩展程序一键解决本地开发跨域问题,让你不用乱mock数据 1.在谷歌浏览器中打开它的网上应用商店 (需要翻墙);2.然后在搜索框中输入:Access-Control-Allow-Origin,在回车搜索一下,就会有图片的结果; 3.在上图第一个工具中点击添加至Chrome进行添加;4.添加成功后就会在浏览器的右上角出现一个绿色的图标(如果你是老司机装的拓展太多可能不能在这...

2018-08-27 21:56:26 466

charles破解jar包

应用 -> 显示包内容 -> Contents -> Java,或者直接到目录/Applications/Charles.app/Contents/Java/。替换掉即可用

2018-09-11

Access-Control-Allow-Origin

谷歌浏览器扩展程序一键解决本地开发跨域问题,让你不用乱mock数据,Access-Control-Allow-Origin工具包

2018-08-27

Git-2.10.2-64 官方绿色版

Git-2.10.2-64 官方绿色版好用,实在

2018-04-20

nodejs网络图片爬虫

解压后,如果node_modules里面你文件路径与你电脑的路径不符,你可以删除了node_modules这个文件然后在运行一下npm install就可以了

2018-04-20

大数据分析

通过爬虫在百度上已经爬到了热40万词,里面有排行榜

2016-06-14

软件测试文档

软件测试,完整、具体、简介、严谨、有用,下载包你不后悔!

2016-06-14

jQuery网页开发实例精解

本书详细讲述了,jquery的各个知识点,在后面的Demo中更是精彩地秀出了各种过上时代的特效,不得学jquery你不算前端,不拿这些源码你会后悔

2015-11-19

前端面试-张云龙

这份面试报告能让你从容,正确的以一个前端的心态去面试,而不是为了面试而面试,你值得拥有着方面的经验。

2015-11-19

myeclipse10破解工具(MyEclipse Cracked) 2.0绿色版

快速简单,帮助你破解myeclipse10,让你不再为购买而烦恼,绝对没有病毒,操作简单,方便。

2015-03-09

jQuery Mobile快速入门234页完整版.pdf + 所有源码.zip

这个资源最对是十分有用的,它能让你看到飞一般的ui,你不下载你绝对后悔。

2015-03-07

jsp参考文档

一个不错的jsp参考手册。你值得拥有!!

2015-01-07

数据结构QuickSort实验

适用于大学数据结构的QuickSort实验提交

2015-01-05

数据结构LeafNum实验

适用于大学数据结构的LeafNum实验提交

2015-01-05

数据结构WordNum实验

适用于大学数据结构的WordNum实验提交

2015-01-05

数据结构 HanoTower实验

使用于大学数据结构的 HanoTower实验

2015-01-05

数据结构JosephRing实验

适用于大学数据结构的JosephRing实验提交。

2015-01-05

8utfp

这是一个免费绿色的网页上传工具,非常的小,安装非常的快,相当其他ftp我觉得它做的非常好,因为ftp主要就是用来上传一些东西到你的空间中,没有必要做太多绚丽的用户体验!

2015-01-04

SmartUpload

这是一个工具类,用于接收前台界面用户上传的文件和图片,放在你的后台中! 不过把它放到myeclipse中需要小心,我试过,挺好用的。

2015-01-04

开心大表哥的留言板

发表于 2020-01-02 最后回复 2020-01-02

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除