- 博客(259)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 git总结2-远程命令
1. github的操作1.注册用户名、邮箱、密码后 登录账号2. 创建远程仓库3. 本地 git init 初始化一个本地项目 新增一个文件4. git add . 提交到本地暂存区5. git commit 提交到本地仓库6. git remote -v 查看当前远程地址别名7. 没有就使用 git remote add origin（地址别名） http-url/ssh-url（地址） 来创建远程地址8. git remote -v 就可以看到fetch 和 push的地址了9.
2021-09-21 17:45:25
314
原创 git总结1-本地命令
1. 版本控制工具分类1. 集中式版本控制工具 svn、cvs、 vss (所有代码在一个服务器上容易出现单点故障问题，版本控制必须通过服务器)2. 分布式版本控制工具 git （代码在每个用户那里，用户自己本地就可以进行版本控制）2. git和svn的实现原理对比1. 版本控制git是快照存储（在.git/objects/文件下）每个文件的改动会生成快照且生成hash戳，当前版本文件没有改动文件指向上一个版本文件的hash戳，每次commit也会生成hash和快照，而所有文件的hash会放到这
2021-09-21 17:44:50
376
原创 webpack学习9-手写webpack
1. 编写的目的自己写一个mini版本的webpck ，从而感受webpack内部的原理2. 需要的工具1. @babel/parser 把文件编译成抽象语法树ast2. @babel/traverse 获取依赖3. @babel/core transformFromAst 方法解析ast的es6 为es54. @babel/preset-env 设置babel环境3. 代码1. webpack.config.jsconst path = require('path');modu
2021-06-26 22:14:11
288
原创 webpack学习8-配置对象常用属性详解
1. entry1. 配置为字符串，单一文件输出， 针对单页面 entry: './src/index.js',2. 配置为数组，多文件输入，单文件输出， 针对 hmr 中html 不更新的情况 entry: [ './src/index.js','./src/print.js'],3. 配置为对象{} 输出多个文件 ，key就是文件名 ，针对多页面 类似于jq的老式前端应用entry: { index: './src/index.js', print: '.
2021-06-26 22:10:46
611
1
原创 webpack学习7-优化特性
1. webpack-dev-server 的 hmr功能 一定要使用webpack serve --hot-only 命令启动不要用npx webpack-dev-server启动hmr 全程为 hot module replacement 热模块替换, 把devServer属性的hot 改为true即可需要验证三种case 改样式 改js 改html 但是我的mac可能出问题了，模块更新后没有刷新浏览器2. source-map方便调试 ，找到源代码到构建后代码的错误位置开启只需
2021-06-26 22:09:42
309
2
原创 webpack学习6-手写plugin2
1. 编写一个 类似于CopyPlugin的插件参数三个 from to ignore2. 准备工作1. 下载工具1. webpack2. webpack-cli3. tapable // tapable类4. schema-utils // 校验option5. globby // 处理文件路径3. 编写1. webpack.config.jsconst path = require('path');const CopyWebpackPlugin = require('./plug
2021-06-26 22:09:09
135
原创 webpack学习5-手写plugin
1. webpack plugin的概念和其中关系1. compiler 钩子Compiler 模块是 webpack 的主要引擎,它扩展(extend)自 Tapable 类，用来注册和调用插件2. Tapable类tapable 是一个类似于nodejs 的EventEmitter 的库, 主要是控制钩子函数的发布与订阅,控制着webpack的插件系.webpack的本质就是一系列的插件运行.2. 准备工作1. 下载工具1. webpack2. webpack-cli3. ta
2021-06-26 22:08:24
511
原创 webpack学习4-手写loader
1.loader概念loader本质上是一个对不同文件处理的函数2.准备工作1. 下载一些包1. webpack2. webpack-cli3. loader-utils // webapck自带的loader工具库4. schema-utils // 校验工具库5. @babel/core babel核心6. @babel/preset-env babel预设环境2. 研究下loader的特性1. 基础结构module.exports = function(content,
2021-06-26 22:07:34
257
1
原创 webpack学习3-常用plugin
1. html-webpack-plugin作用：如果没有html模版，用它来创建html；或者有html的情况下，来修改html, 生产环境会自动压缩html 和js用法： plugins: [ new htmlWebpackPlugin(), ]！！！注意 开放性使用file-loader 可能会导致html-webpack-plugin的崩溃， 具体表现为出现.bin、.esj、 以及标签只有head的情况目前的解决办法是保守使用file-lo
2021-06-26 22:06:35
308
1
原创 webpack学习2-常用loader
1. style-loader作用：使得css样式写入html的head中 ，缺点是js打包很大，常和css-loader配合使用用法： { test: /\.css$/, use: ['style-loader', 'css-loader'] }2. css-loader作用：css-loader会处理import / require（）/ @import / url 引入的.css的文件用法： {
2021-06-26 22:05:29
162
1
原创 wepack学习1- 概念
webpack中最重要的是五个概念1. entry 入口对应entry 属性可以指定单页面或者多页面应用的入口文件地址2. output 输出设置对应 output属性可以细化打包输出的规则 ，例如文件3. loader 处理文件对应 module属性 注意 是module属性可以使你在 import 或"加载"模块时预处理文件，主要用来处理语言后缀相关解析的 例如.js .jsx .ts .tsx .cdd .less .sass .scss4. plugi.
2021-06-26 22:04:27
172
原创 docker学习2
1. docker的ci cd 功能1. ci (continuous intergration) 持续集成持续集成： 编写代码时，完成了一个功能后，立即提交代码到git仓库中去，将项目重新构建并测试1 . 快速发现错误2 . 防止代码偏离主分支2. cd (continuous ) 持续集成持续集成： 编写代码时，完成了一个功能后，立即提交代码到git仓库中去，将项目重新构建并测试1 . 快速发现错误2 . 防止代码偏离主分支2. 实现持续集成ci1. 使用docker
2021-05-07 21:44:57
99
原创 docker学习1
1. docker的概念docker 是一个开源的应用容器引擎，让开发者可以打包他们的应用以及依赖包到一个可移植的容器中，然后发布到任何流行的Linux机器上，也可以实现虚拟化，容器是完全使用沙箱机制，相互之间不会有任何接口。简言之，就是可以在Linux上镜像使用的这么一个容器。docker是为了解决：1, 解决环境不一致问题2, 在多用户的操作系统下，会相互影响3, 解决用户量暴增，运维成本问题4, 学习一门新技术，技术环境成本过高2. 安装dockermacOS 我们可以使用
2021-05-04 21:33:34
260
原创 nginx学习
关于nginx的学习 ，详细可以看章亦春大佬的git ，深入了解内部原理https://github.com/openresty/nginx-tutorials/tree/master/zh-cn前端的话关于 nginx其实也就常用的那么七个知识点，在此总结下：1. http - server 模块 listen 字段监听端口listen 80;2. http - server 模块 server_name 域名：server_name loca...
2021-05-01 21:32:02
93
原创 nginx部署单页面应用以及使用 docker容器部署单页面应用
文章分为两部分：part1. nginx 部署单页面应用part2.使用docker 容器部署单页面应用*****************分割线*****************part1. nginx 部署单页面应用以下步骤以mac为例子，（window上文件目录略有不同，最重要记得windows文件目录路径需要转码以下 类似于 \ 转为\\ 这样）1， 下载niginx ，没有brew 的先下载brewbrew install nginx在此我有话要说，...
2021-04-25 22:11:49
430
原创 python学习6
1. 模块 modules1. 模块的好处1. 一个.py文件结尾的文件就是一个模块2. 模块中可以包含多个类、函数、变量3. 两个模块的相同名称的变量不会冲突2. 导入模块1. 直接导入模块所有的内容 可以用as 起个别名import mathprint(math.pi)import math as mprint(m.pi)2. 精确引入模块中的某个类、函数、变量from math import piprint(pi)3. 如何导入自定义的模块 demo2 引入demo1
2021-03-02 21:38:59
276
原创 python学习5
4. 类 clas在python中一切皆对象1. 定义对象class Person 首字母大写 可以使用pass 占位class Person: pass1. 类属性直接写在类里的变量成为类属性，被所有的实例后的对象所共享,class Person: head = 1 arm = 2 legs = 2通过类去修改后会把新值全部拷贝到所有实例上去，通过实例去修改只会改到属于自己的部分xiaoming = Person('xiaoming
2021-03-02 21:38:30
106
原创 python学习4
1. 字符串1. 字符串的在内存中的驻留机制字符串一般值相同的内容会在内存中存储在一个常用的池子中复用会有很多的情况触发这个机制，怎么触发的不太重要，可以认为所有的操作在pycharm中都可以触发这个机制2. 字符串的查找1，index正着找 rindex倒着找 找不到会报错str1 = 'on' str2 = 'sss' str3 = 'onpython' print(str3.index(str1)) print(str3.rindex(str1)) print(str3.rind
2021-02-13 18:58:32
192
1
原创 python学习3
1. 列表 相当于数组1. 列表的创建和删除1. 直接用[]声明a='1' li=[1,2,a]2. 使用range函数创造迭代器核心，再用list()方法来创建ran = range(5,10,2) li = list(ran)3. 也可以 使用list作为核心，再用list()方法来创建 ,应该可以用作浅复制；a='1' li=[1,2,a] li1 = list(li)2. 列表的增删改查操作1. 增1 . append方法 追加一个元素到数组末尾li1 = [1,2,3]
2021-02-12 18:43:39
239
2
原创 python学习2
1. 注释类型1. 单行注释#号 来表示2. 多行注释''' 哈哈 ''' 来三引号进行多行注释，不赋值给变量就可以了3. 中文编码申明注释 不重要 但是不要随便改否则会报错Non-UTF-8 code starting with ‘\xc7’ in file#coding:gbk 把中文编码格式改为了gbk编码不重要 但是不要随便改否则会报错 Non-UTF-8 code starting with '\xc7' in file2. input 输入函数的用法input
2021-01-30 23:13:11
172
原创 python学习1
1. python的安装，编辑工具pycharm安装1. 如果外网打不开，就去qq管家下载一个适合自己的python的版本在开始菜单可以看到python下有四个程序，一个简易编辑器，一个命令行，一个语言文档， 一个包工具文档2. 下载pycharm的社区版本2. 创建模板 专属印记settings -> editor -> File and Code templetes -> pythonScript 增加类似如下代码 变量为${}形式# dep 大威天龙# cr
2021-01-30 23:12:29
315
原创 http协议理解8
1. nginx 高性能的服务器主流web服务器只有两个Apache 和Nginx 合计占了90%的市场份额，其中nginx 拥有了超过50%的用户nginx的工作原理1. 进程池nginx是一个轻量的web服务器,cpu 内存都占用很少，奥秘在于独特的工作模式1. 单线程2. 预创建固定数量的worker进程，在此后不会增加新的进程，自动把进程帮到到cpu上，解决了进程切换成本，充分利用cpu3， 在进程池之上还有一个master进程专门来管理进程池 守护不正工作的线程， 保证稳
2020-12-31 19:52:41
213
原创 http协议理解7
1.HTTPS优化1. 硬件优化1.更快的cpu2. SSL加速卡3. SSL加上服务器2. 软件优化1. 软件升级2. 协议优化1 .如果有可能，尽量采用TSL1.32 .如果只能使用1.2，那么也要开启Flase Start的。从第一次握手就开始发送内容3. 会话复用 SessionID 服务端控制携带4. 会话票证 Session Ticket---- Token 客户端携带2. 如何迁移到HTTPS1. 申请证书let’s Encrypt 是著名免费CA，他只颁发
2020-12-30 21:27:35
434
原创 http协议理解6
1. http的缓存代理缓存代理是代理增加了缓存的功能，缓存服务器的数据，分发给下游的客户端1. 源服务器的缓存控制在头字段Cache-Control增加了两个新的值1. private 表示只能在客户端缓存2. public 表示哪里都可以缓存 可以缓存到代理服务器上2. 客户端的缓存控制在头字段Cache-Control增加了两个新的值，关于缓存时间 细化 扩张和缩减1. max-stale=10 表示即使过期了也能接受10s2. min-fresh=30 表示绝对不允许
2020-12-28 21:20:14
146
原创 http协议理解5
1. http的连接管理1. 短连接1.三次握手 建立连接2.四次挥手 断开连接2. 长连接因为短连接每次都要三次握手，四次挥手 导致效率很低。所以就对一个连接进行复用。3. 链接相关的头字段1. Connection: keep-alive 表示支持长连接， 服务器通常不会主动关闭长连接。2. Connection: close 客户端请求关闭长连接服务器也可以设置一些值来管理长连接，如nginx, 可以设置keepalive_timeout 过一段时间没有请求就关闭长连接ke
2020-12-26 21:13:50
223
原创 http协议理解4
1.状态码1. 1XX 提示信息，意思是处理中 还有后续的操作；1. 101 客户端使用upgrade字段，要求在http的基础上改为其他协议例如websocket来继续进行通信，服务器如果同意 就会发送101状态码2. 2XX 成功，报文已经收到并被成功处理；1. 200 一切正常。2. 204 一切正常。没有返回body数据3. 200 一切正常。分块下载和断点续传， 通常还伴随着字段content-range 表示传输整体body字节的范围 例如 100-2003. 3XX 重定向，资
2020-12-23 21:40:30
188
原创 http协议理解3
1. 域名里的门道1.域名转换为ip的过程，称之为域名解析。dns 的核心系统是一个三层的树桩分布式结构，基本对应域名的结构：1 .根域名服务器 返回 .com .cn .net 全世界有十三组根服务器。2 .顶级域名服务器 返回 apple.com3 .权威域名服务器 返回 www.apple.com基本上就是通过.com找到根服务器ip，然后在通过根服务器找到apple.com的顶级ip，一级一级递归下去。2.dns缓存即使全世界有很多dns服务器 也顶不住全世界所有的
2020-12-18 21:17:57
145
2
原创 http协议理解2
1.html相关的各种协议1. TCP/IP协议 是网络世界的事实标准通信协议，其他的还有UDP，ICMP，ARP等协议；共同构成了一个复杂但有层次的协议栈。四层协议：1，链接层 2，网际层（IP）3，传输层（TCP）4，应用层a . IP主要目的是为了解决寻址和路由问题。以及如何在两点间传输数据包。ip分为v4（4组）和v6（8组）两个版本，v4已经用完了，目前是v6，另外没有其他V1，2，3，5的版本b . TCP字面意思是传输协议，基于IP协议提供可靠的字节流形式的通信，是http的
2020-12-18 16:18:22
194
1
原创 http协议理解1
http的 5个版本http/0.9最初版本只有get请求并且是短链接只支持文本http/1.0新增了head get等请求增加状态码引入了版本协议号的概念引入了头部header的概念，使请求的处理更加灵活传输不再限制只是文本类型http/1.1增加了put，delete等方法增加了缓存管理和控制使用长连接允许数据分块，利于传输大文件强制要求加上host头部字段，让互联网主机托管成为可能使用最多的协议http/2二进制为基础协议，不再是纯文
2020-12-18 16:17:17
112
2
原创 antd-vue 权限控制
1，路由权限控制 第一步，定义方法export function getCurrentAuthority(){ return ['user']}export function check(authority){ const current = getCurrentAuthority(); return current.some(v=>authority.includes(v));}export function isLogin(){ con..
2020-10-25 16:31:49
2381
原创 antd-vue使用心得
1， less的loader 报错增加vue.config.jsmodule.exports = { css: { loaderOptions: { less: { javascriptEnabled: true } } }, }2， 按需加载在babel中加入插件antd 配置安装babel-plugin-import{ "plugins"...
2020-10-18 18:32:20
2298
原创 vuex的最佳实践
目录结构如下1， mutation 常量代替变变量export let BOOKS ={ ADDJS:'ADDJS', ADDJAVA:"ADDJAVA", RESET:'RESET'}export let USERS ={}2，开启命名空间module嵌套不要太深 尽量扁平化灵活使用 createNamespacedHelper辅助函数user.jsimport {USERS} from '../mutationTypes';...
2020-10-17 23:11:06
471
原创 移动端常用图片布局
效果：1，// 利用padding-top 拉出一个正方形 width: 33.3333%; padding-top: 33.3%; height: 0;2，// 利用上下左右定位， 来拉到最中间 ， 调整距离 对元素进行缩放 position: absolute; left: 5px ; top: 5px ; bottom: 5px; rig..
2020-10-05 15:28:09
349
原创 正则格式化时间戳
// 把毫秒数 转换为 时间戳 yyyy-MM-DD hh:mm:sslet parseTime = (time)=>{ let date = null; const format = '{y}-{m}-{d} {h}:{i}:{s}'; if(typeof time === "string" ){ time = +time; } date = new Date(time); const formatObj ...
2020-10-04 15:44:23
534
原创 uniapp云开发请求封装
云开发中请求中对于对多个云函数的大段重复逻辑，还是很有必要封装一下的大概这样的目录apis 目录 2 file index.jsimport http from '../http.js'export const holy = async()=>{ return http({url:'holy-test'})}main.jsimport http from '../http.js'export const heil = async ()=>{...
2020-08-30 19:53:28
991
原创 uniapp云开发
unicloud 开发：构成：1， 云函数2，云数据库：json格式的表3，云存储和cdn云函数 运行在云端的函数1，这个函数是执行在严格环境下的函数（避免使用没有声明的变量）2， 从数据库差数据需要使用await 来拿到结果3， 参数 （ event ，context ），event 是客户端传入的参数 ， context 包含了 系统调用信息和运行状态4， 客户端调用云函数 uniCloud.callFunctions(){}5, 记得改完 ...
2020-08-30 19:06:56
2346
2
原创 uniapp入门
uniapp是在vue和小程序的基础上构建的框架，因此只记录和vue以及小程序使用不同的地方1， hbuilder x 使用微信小程序开发工具， 需要开启小程序开发工具的端口号才行；小程序工具->设置->通用设置->安全-> 开启端口2， 如果联动微信小程序失败的话， 需要手动用微信开发工具的小程序开启uniapp项目 /dist/mp-vue项目3， 设置页面中h5下的下拉刷新样式的代码为如下， （如果要设置一个具体特殊位置的样式会比较深）"pages":..
2020-08-22 19:42:57
333
原创 手写简化版vue2
vue.jsclass Vue{ constructor(options={}){ this.$el = document.querySelector(options.el); let data = this.data = options.data; // 代理data,使this.data.xxx 变为this.xxx Object.keys(data).forEach(key=>{ this.pr
2020-08-15 21:39:01
357
原创 vue3源码学习
使用最新的vue3.0 输入命令 vue add vue-next****************option api 和 compositi on api的区别1， a 传统对象api, b hooks api 函数式变成 增强复用2， b 使用了ref computed 很好的支持了 tree-shaking（摇树）3， b 取代了 mixins4, hooks 每次都产生一个hooks闭包，b第一次会产生一个闭包，其他用响应式实现*********...
2020-07-18 16:08:26
467
原创 vue基础篇
总结内容基于2.x版本。使用vue-cli生成命令 ： vue create demomvvm ， m model 数据模型， v ，view视图， vm vue 干了两件事 第一件 监听 dom ， 第二件，把modal数据和view绑定起来1,选项 / 生命周期钩子常用 钩子beforeCreate:()=>{ console.log('beforeCrearte') }, created:()=>{ console.log('creat...
2020-06-27 18:20:31
273
nodeJs高级编程
2018-08-26
javascript语言精粹 修订版
2018-08-23
react语言精粹
2018-08-23
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人