自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(15)
  • 收藏
  • 关注

原创 craco配置postcss8下的postcss-px-to-viewport插件

craco配置postcss中的postcss-px-to-viewport插件

2022-07-13 15:18:01 4622 5

原创 Koa2框架生态实战

补充知识点:1.git操作相关git commit -m “refactor:” -> refactor表示修改了目录结构git commit -m “feat:路由的演示” -> feat表示增加了新功能git push origin master -> 提交到某条分支git diff [文件名] -> 查询文件修改情况git log -> 查看提交日志 按Q退出git show 日志编号 -> 查看提交内容2.j

2021-09-21 14:54:27 965

原创 CSS常用布局总结

一、CSS还原UI设计1.Photoshop还原UI设计查看尺寸信息方式一、点击窗口->信息,选择选框工具,并打开选框工具面板选项,设置鼠标单位为像素,选中一定范围后,即可在打开的信息面板上看到方式二、选中移动工具,在左上角设置选项为“图层”,点击ctrl即可看到相关像素信息。(选择时要注意选择相关图片中有颜色的区域)查看颜色信息找到吸管工具,点击相关颜色,即可查看查看文字信息打开字符窗口,选择移动工具,按住ctrl,选择相关文字,即可在字符窗口中看到相关文字信息。PS切

2021-09-21 14:45:55 738

原创 React学习笔记

1.React简介用于构建用户界面的JavaScript库是一个将数据渲染为HTML视图的开源JavaScript库。由Facebook开发,且开源React正在被腾讯、阿里等一线大厂广泛使用。为什么要学?原生JavaScript操作DOM繁琐、效率低(DOM-API操作UI)。使用JavaScript直接操作DOM,浏览器会进行大量的重绘重排。(即便用jQuery,也只是方便了编码,并没有增加页面性能)原生JavaScript没有组件化编码规范,代码复用率低。React

2021-09-20 16:33:57 194

原创 面试必备--JS函数工具库手写

1.call函数封装实现主要思路:给传入的对象创建一个临时变量(obj.temp),并将传入的函数地址(Fn)给这个对象,让两个变量(Fn与temp)指向同一个内存地址。此时通过obj.temp调用内存中的这个函数,会使得函数内部的this变为obj,最终将调用结果返回。如此一来,就相当于改变了Fn内部this的指向,并同时执行了一次Fn。export default function call(Fn, obj, ...args) { // 判断 if (obj === undefi

2021-09-13 17:30:17 160

原创 TS学习笔记

源码地址一、快速入门01. TS简介02.TS开发环境搭建安装node.js安装tsnpm i -g typescript创建一个ts文件使用tsc对ts文件进行编译4.1 进入命令行4.2 进入ts文件所在目录4.3 执行命令:tsc xxx.ts03.TS的类型声明类型声明类型声明是TS非常重要的一个特点通过类型声明可以指定TS中变量(参数、形参)的类型指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错

2021-09-13 17:13:48 395

原创 VuePress学习笔记

一、vuepress初体验创建一个项目文件对项目进行初始化yarn init # npm init安装VuePressyarn add -D vuepress # npm install -D vuepress创建第一篇文档mkdir docs && echo '# Hello VuePress' > docs/README.md在package.json中配置启动命令{ "scripts": { "docs:dev": "vuepr

2021-09-12 16:35:20 1884 2

原创 Windows环境下Mongo安装配置

一、下载Mongo数据库并安装下载链接根据自己电脑类型选择不同平台的软件安装包,window10用户可选择4.4.4进行下载,window7用户可选择4.2进行下载,因为4.4.4-signed支持window7系统;二、配置环境变量1.右击计算机,选择属性2.在弹出的面板里面,选择高级系统设置3.弹出框中点击环境变量,在系统变量中打开Path选项,在里面输入MongoDB安装目录的bin目录地址(注意:前面需加分号)4.此时,在终端中输入mongod --v,即可看到相关安装信息

2021-08-22 15:12:52 676

原创 Koa2学习

一、基础知识什么是koaKoa 基于 Node.js 平台的下一代 Web 开发框架,由 Express 原班人马打造的,致力于成为一个更小、更富有表现力、更健壮的 Web 框架。和 Express 不同,使用 Koa 编写 web 应用,通过组合不同的 generator,可以免除重复繁琐的回调函数嵌套,并极大地提升错误处理的效率。阿里基于 Koa 开发了 Egg.js 企业级框架,在 Koa 的模型基础上,进一步对它进行了一些增强,可以帮助开发团队和开发人员降低开发和维护成本。异步编程模型No

2021-08-22 13:44:08 297

原创 Vue3学习笔记

1.创建Vue3.0工程1.1 使用 vue-cli 创建官方文档:https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create## 查看@vue/cli版本,确保@vue/cli版本在4.5.0以上vue --version## 安装或者升级你的@vue/clinpm install -g @vue/cli## 创建vue create vue_test## 启动cd vue_testnpm run serve

2021-08-13 22:18:53 957

原创 Vue学习笔记

1. Vue的特点1. 采用组件化模式,提高代码复用率、且让代码更好维护。2. 声明式编码,让编码人员无需直接操作DOM,提高开发效率。3. 使用虚拟DOM+优秀的Diff算法,尽量复用DOM节点。2. Vue官网教程:入门教程API : 类似于字典风格指南:Vue官方推荐编码规范示例:官方示例Cookbook: Vue的一些技巧![在这里插入图片描述](https://img-blog.csdnimg.cn/8a099dbdfc9c4e889c54c2bfbd0c29d0.png)

2021-08-07 21:16:02 917

原创 关于设置了source-map在chrome中仍无法显示webpack://的问题

1.设置source-map的作用为了在开发环境下方便vue代码编译,故需要在vue.config.js中设置相应的Devtool选项。具体配置项可参考:webpack官网。此处为了能在sources中看到源码,故设置为source-map。2.Chrome中无法显示webpack://设置后,在其它浏览器中都可以找到webpack://选项。而chrome中却无法显示,且源码均被打包到app.js中。此时,需要修改将其打钩后,就可正常显示。...

2021-07-12 17:22:31 5387 3

原创 p标签中英文换行内容问题

1.数字、英文的情况p中的内容如果是英文,则会按单词(默认按空格来分隔单词)来进行换行。如果一个单词长度大于p标签的宽度。则会发生溢出。数字同理2.中文的情况p中的内容如果是中文,则会自动换行。即便中文中有字母或者空格(无论字母处在什么位置)。3.使数字、英文自动换行通过添加word-break: break-word。可以使得数字、英文自动换行。<!DOCTYPE html><html lang="en"><head> <me

2021-06-11 20:00:01 2750

原创 关于使用flex-shrink无法压缩图片的问题

代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&gt

2021-06-10 21:32:01 407

原创 关于transition 在:hover状态下设置位置不同导致效果不同的问题

关于transition 在:hover状态下设置位置不同导致效果不同的问题1. 设置在css类中 .showcase a{ width: 270px; /* width: 150px; */ height: 180px; background-color: #fff; margin: 20px; transition:all .3s;}– 此时会导致鼠标覆盖时在进入和退出时都会触发动画2.设置在:hover中.showcase a:hover{

2021-06-10 17:23:56 389

空空如也

空空如也

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

TA关注的人

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