前端
文章平均质量分 80
小洋人最happy
梦想,源自坚持
展开
-
EditorConfig和Prettier简介及配置
Prettier 是一个代码格式化工具,专注于自动化代码格式化。它支持多种编程语言,并且可以与各种编辑器和工具集成。Prettier 的主要目的是通过自动格式化代码来确保代码风格的一致性,减少代码审查中的风格争论。EditorConfig 是一个帮助开发者在不同的编辑器和 IDE 之间保持一致的编码风格的工具。EditorConfig 和 Prettier 都是用于代码格式化和风格一致性的工具,但它们有不同的用途和功能。来定义项目的编码风格规则,例如缩进、换行符、字符集等。原创 2024-06-25 08:15:00 · 583 阅读 · 0 评论 -
TypeScript中any和unknown的区别
在TypeScript中,any 和 unknown 都是用来表示任意类型的类型标注,但它们有一些重要的区别。原创 2024-06-20 08:30:00 · 411 阅读 · 0 评论 -
邂逅React及React初体验
==>在类中直接定义一个函数,并且将这个函数绑定到元素的onClick事件上,当前这个函数的。Flutter的很多灵感都来自React,来自官网的一段话:(SwiftUI呢)// jsx语法 -> 普通的JavaScript代码 -> babel。Vue.js框架设计之初,有很多的灵感来自Angular和React。中,如何封装一个组件呢?目前对于前端开发来说,几乎很少直接使用原生的。// 编写React代码(jsx语法)代码时,这三个依赖都是必不可少的。,这个数据是定义在当前对象的。原创 2023-10-27 08:30:00 · 238 阅读 · 0 评论 -
一遍文章搞懂Vue.js中的各种页面跳转方式和参数传递
Vue.js是一个流行的JavaScript框架,它提供了一套完整的路由系统来帮助我们实现SPA(单页应用)的页面跳转和数据传递。Vue.js的路由系统是基于浏览器端的和hash模式实现的,它使得我们可以在不刷新整个页面的情况下实现URL的变化和页面的切换。本文将介绍在Vue.js中实现页面跳转的方式和参数传递的方法,帮助你更好地理解Vue.js的路由系统和页面跳转机制。页面跳转和参数传递是Web应用开发中非常基础的功能。在Vue.js中,我们可以使用Vue Router。原创 2023-04-19 08:15:00 · 4790 阅读 · 1 评论 -
跨域PreflightMultipleAllowOriginValues、HeaderDisallowedByPreflightResponse错误及解决方案
跨域常见报错及解决方案原创 2023-02-24 10:17:30 · 2127 阅读 · 0 评论 -
CSS媒体查询简介及案例
`媒体查询`是一种提供给`开发者`针对`不同设备`进行`定制化开发`的一个接口。通过它,我们可以根据`设备类型(比如屏幕设备、打印机设备)`或`特定的特性(比如屏幕的宽度)`来修改或适配页面。原创 2022-12-07 09:00:00 · 669 阅读 · 0 评论 -
CSS常用函数补充(var、clac、blur、gradient)
CSS中常用函数补充(var、calc、blur、gradient),简介及使用演示原创 2022-12-05 09:00:00 · 1082 阅读 · 1 评论 -
white-space和text-overflow小记
CSS中white-space和text-overflow小记原创 2022-12-03 11:18:15 · 273 阅读 · 0 评论 -
Lint-staged自动修复格式错误及小结
husky pre-commit结合lint-staged完成代码格式自动修复及提交原创 2022-11-29 09:15:00 · 3862 阅读 · 0 评论 -
Git Hooks简介及结合Husky和Commitlint检测提交代码规范
Git Hooks简介,结合Husky+CommitLint检查提交代码是否符合规范,通过pre-commit节点做处理原创 2022-11-28 09:00:00 · 2849 阅读 · 0 评论 -
Git之借助Commitizen规范化提交代码
约定式提交规范,使用commitiizen规范化提交代码原创 2022-11-25 09:15:00 · 1491 阅读 · 0 评论 -
VSCode中Prettier插件&依赖安装及冲突解决
Prettier 一个“有态度”的代码格式化工具,在VSCode中插件安装和依赖安装使用原创 2022-11-24 19:34:52 · 5778 阅读 · 0 评论 -
一篇文章搞懂ES6,真的不能再细了
ECMAScript 6新特性let 关键字let关键字用来声明变量,使用let声明的变量特点如下:不允许重复声明块级作用域不存在变量提升不影响作用域链示例如下:<script> // 1. 不允许重复声明 // let name = '旺财'; // let name = '小强'; // 2. 块级作用域 // 声明的变量只能在块内使用,if while for else // { // let name2 = '罗志祥';原创 2020-08-12 16:37:40 · 435 阅读 · 0 评论 -
一遍文章搞懂Vuex不是梦---Vuex详解
Vuex概述组件间共享数据的方式父向子传值:v-bind属性绑定子向父传值:v-on事件绑定兄弟组件之间共享数据:EventBus$on 接收数据的组件$emit 发送数据的组件上述只适合小范围内数据共享,如果是复杂应用的话,就不再合适了。Vuex是什么Vuex是实现组件全局状态(数据)管理的一种机制,可以方便的实现组件之间数据的共享如图:在不使用Vuex进行状态管理时,如果要从最下面的紫色组件传递数据的话,还是比较繁琐,也不便于维护。在使用Vuex进行状态管理时,只需要一原创 2020-07-18 15:46:00 · 3550 阅读 · 7 评论 -
CSS浮动详解及案例
浮动的规则规则一元素一旦浮动后脱离标准流朝着向左或向右方向移动,直到自己的边界紧贴着包含块(一般是父元素)或其他元素的边界为止定位元素会层叠在浮动元素上面示例 <style> .box { height: 500px; background-color: green; }span { background-color: hotpink; } strong background-color: khaki;原创 2020-07-14 11:06:45 · 3896 阅读 · 1 评论 -
Flex布局及属性详解
文章目录一、前言二、Flex概念2.1 简介2.2 基本概念三、Flex-Container属性3.1 flex-direction3.2 justify-content3.3 align-items3.4 flex-wrap3.5 flex-flow3.6 align-content四、Flex-Item属性4.1 order4.2 align-self4.3 flex-grow4.4 flex-shrink4.5 flex-basis4.6 flex一、前言布局的传统解决方案,基于盒状模型,依赖 d原创 2020-07-08 13:42:35 · 4184 阅读 · 0 评论 -
CSS定位详解及案例
文章目录一、标准流1.1 概念1.2 不足二、定位2.1 概念2.2 static-静态定位2.3 relative-相对定位2.3.1 特点:2.3.2 示例一2.3.3 示例二2.4 fixed-固定定位2.4.2 特点2.4.2 示例2.5 absolute-固定定位2.5.1 特点2.5.2 子绝父相2.5.3 示例一2.5.4 示例二2.6 层叠关系2.6.1 元素层叠2.6.2 z-index特点:2.6.3 比较原则2.6.3.1 兄弟关系2.6.3.2 如果不是兄弟关系三、小结3.1 对照表原创 2020-07-05 12:34:06 · 2266 阅读 · 1 评论 -
VSCode中Vue进行模块划分、设置别名以及解决路径不提示问题
文章目录一、项目模块划分二、设置别名三、路径提示1. 安装Path Intellisense插件2. 扩展设置3. 新建jsconfig.json4. 验证效果一、项目模块划分在使用Vue进行项目开发的时候,一般会根据项目模块对目录进行划分,比如views、components、common、network等,将各自负责内容进行分类,方便管理和维护,以小demo为例,目录结构为:二、设置别名如上,在划分完目录后,在项目开发中引用其他文件时,传统方式会采用../等相对路径来写,比如:import原创 2020-07-01 22:00:30 · 6344 阅读 · 7 评论 -
一遍文章搞懂CSS清除浮动本质、原因及解决方案
文章目录1. 为什么要清除浮动2. 排版问题示例3. 清除浮动本质及策略4. 清除浮动方案4.1 额外标签法4.2 父级添加overflow4.3 :after伪元素法4.4 双伪元素清除浮动5. 小结5.1 清除浮动前提条件5.2 方案对比1. 为什么要清除浮动大白话:由于父级盒子在很多情况下,不方便给出确定高度(eg. 图一),但是子盒子开启浮动后,脱离了文档流,不再占有位置,最后父级盒子高度为0,就会影响下面的标准流盒子。术语:由于浮动元素不再占用原文档流的位置,所以会对其父容器后面的元素排版产原创 2020-05-27 21:43:19 · 726 阅读 · 0 评论 -
webpack&webpack-cli完全卸载
删除全局webpack-clinpm uninstall -g webpack-cli# 卸载 uninstall 可以简写成 un # 全局 -g 的完整写法是 --global# 现在问题来了这样真的卸载了webpack-cli吗?# 答案是没有。到现在为止我还没有发现那个webpack-cli是全局安装的,至少官方文档没看到。# 那就看下面怎么删除局部webpack-cli...原创 2019-06-04 14:28:33 · 4116 阅读 · 0 评论