自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 git fetch和git pull的区别

git fetch是“安全模式”:只下载远程代码,不修改本地工作分支,需手动合并,适合需要先核查差异的场景。git pull是“快捷模式”:等价于,自动下载并合并,适合无冲突的简单场景。核心区别:是否自动合并到当前工作分支,fetch可控,pull快捷但有冲突风险。git fetch拉取的远程分支,取决于你执行命令时的参数和当前本地分支的关联配置,我会分场景讲清楚,新手也能精准控制要拉取的分支。git fetch无参数:默认拉取当前分支关联的远程分支的代码,同时更新所有远程分支的引用。

2026-03-13 13:47:16 385

原创 在package.json中scripts这个配置的命令是什么意思

本文解析了Vue项目中常见的npm脚本命令及其区别。serve是默认开发模式,serve:test等带--mode参数的命令会加载对应环境配置(如.env.test),实现不同环境(开发/测试/预发布)的自动切换,避免手动修改配置。核心区别在于加载的环境变量不同,如接口地址等。这种设计能规范团队操作,适配不同环境需求,提升开发效率。特殊命令dev通过设置NODE_OPTIONS解决Node版本兼容问题。这些命令体现了现代前端工程化的环境隔离思想。

2026-03-13 13:39:29 270

原创 在package.json中scripts这个配置是用来干什么的

package.json中的scripts字段是Node.js项目的核心配置,用于定义可执行的命令别名。通过npm run <别名>即可执行对应命令,能简化复杂操作(如npm run serve替代长命令)、统一团队规范、自动处理跨平台差异。支持命令拼接(&&串行/&并行)、钩子机制(pre/post前缀)和环境变量传递。常见内置命令如npm start可直接执行。合理配置scripts能显著提升开发效率,是项目标准化的重要部分。

2026-03-13 08:44:12 304

原创 在package.json中scripts这个配置是用来干什么的

package.json中的scripts字段是Node.js项目的核心配置,用于定义可执行的命令别名。它简化了复杂命令(如npm run serve替代长命令),统一团队规范,并支持跨平台兼容。通过npm run <脚本名>执行时,npm会自动处理路径和环境变量。常见用法包括命令拼接(&&串行/&并行)、钩子命令(pre/post前缀)和环境变量传递(使用cross-env)。配置scripts能显著提升开发效率,避免手动输入长命令,确保团队操作一致。内置脚本如npm

2026-03-11 17:54:38 381

原创 git常见问题记录:【git clone后报错】 warning: remote HEAD refers to nonexistent ref, unable to checkout.

git常见问题记录:【git clone后报错】 warning: remote HEAD refers to nonexistent ref, unable to checkout.

2026-03-10 10:05:59 239

原创 mac 安装node提示 nvm install v14.21.3 failed可能存在问题

摘要:本文提供了在Apple Silicon Mac上安装Node.js 14.21.3的两种解决方案。首选方案是通过Rosetta安装x64版本,详细步骤包括:1)安装Rosetta;2)启动x86_64终端;3)配置nvm;4)指定x64架构安装Node。备选方案是源码编译安装,需要安装Xcode工具链和Homebrew依赖。文章给出了可直接执行的完整命令序列,并包含版本验证方法,帮助用户快速解决ARM架构下安装旧版Node.js的兼容性问题。

2026-03-10 09:41:45 403

原创 CommonJS和ES6 Modules区别

CommonJS 和 ES Modules (ESM) 是 JavaScript 中两种主流的模块规范,分别用于不同场景(Node.js 与浏览器/现代 Node.js),核心区别体现在语法、加载机制、运行时行为等方面。

2025-08-02 22:55:46 1148

原创 eact、vue中的key有什么作用?

vue中key 的作用

2025-07-06 15:16:51 233

原创 vue中diff算法的原理

Vue 的 虚拟 DOM Diff 算法 是其高效渲染的核心,它通过比较新旧虚拟 DOM(VNode)的差异,计算出最小的 DOM 操作,从而提升性能。

2025-06-17 00:09:58 1184

原创 npm install的原理

npm install 的原理

2025-06-06 17:47:22 1395

原创 npm install 相关命令

总结了npm常用安装命令,包括基本安装(npm install/i)、特定包和版本安装(@version)。介绍了不同依赖类型选项:生产依赖(-S)、开发依赖(-D)和全局安装(-g)。提供了其他实用选项如锁定版本(-E)、强制安装(--force)、离线模式和仅安装生产依赖等。还包含版本管理命令(update/outdated)及版本符号(^/~)说明,强调package-lock.json的版本锁定作用。最后提示项目开发流程:先npm install安装依赖,再npm run dev启动服务。

2025-06-05 16:56:06 972

原创 oauth2.0

OAuth 2.0 是一个授权框架,它允许第三方应用获取对用户资源的有限访问权限,而无需获取用户的密码。

2025-06-03 22:34:03 1411

原创 浏览器缓存

强缓存是一种高效的缓存机制,通过和Expires头控制资源的缓存行为。: 提供灵活的缓存控制选项,如max-age和s-maxage。Expires: 指定资源的绝对过期时间。工作流程: 浏览器根据缓存控制头存储资源,并在缓存未过期时直接使用缓存的资源。优点: 提高性能、减少带宽消耗、简化缓存管理。缺点: 内容更新问题、缓存控制头设置不当。通过合理设置强缓存头,可以显著提高网页的加载速度和性能。如果你有其他问题或需要进一步的解释,请随时告诉我!协商缓存是一种缓存机制,通过ETag和或和。

2025-02-21 10:00:00 879

原创 组件二次封装

2.封装的组件也可以像 ui组件库那样使用插槽拓展功能。使用$attrs而不是使用props进行数据传递,在组件中用ref把属性或方法提升到实例中,使用$listeners传递事件。3.获取组件的属性或方法等。基于ui组件库的二次封装。组件封装的方法或思想。1.属性和事件的传递。

2025-02-20 13:05:06 343

原创 浏览器本地存储(cookie,web Storage API,indexedDB)

Cookie: 存储在客户端的小型文本文件,用于会话管理和用户偏好设置。属性名称和值: 唯一标识符和数据。路径: 指定Cookie的发送路径。域: 指定Cookie的发送域名。过期时间: 指定Cookie的过期时间。安全标志: 控制Cookie的发送协议。HttpOnly 标志: 防止 JavaScript 访问Cookie。SameSite 标志: 控制Cookie的跨站发送行为。设置和发送: 通过Set-Cookie响应头设置Cookie,浏览器自动在请求中发送符合条件的Cookie。

2025-02-07 08:00:00 1193

原创 this指向

在 JavaScript 中,this 的值在函数调用时确定,而不是在函数定义时确定。函数调用的方式决定了 this 的指向。以下是一些常见的调用方式以及它们如何影响 this 的指向:

2025-01-17 12:20:53 728

原创 原型与原型链

在JavaScript中是使用构造函数来新建一个对象的,每一个构造函数的内部都有一个 prototype 属性,它的属性值是一个对象,这个对象包含了可以由该构造函数的所有实例共享的属性和方法。当访问一个对象的属性时,如果这个对象内部不存在这个属性,那么它就会去它的原型对象里找这个属性,这个原型对象又会有自己的原型,于是就这样一直找下去,也就是原型链的概念。JavaScript 对象是通过引用来传递的,创建的每个新对象实体中并没有一份属于自己的原型副本。原型链上的所有原型都是对象,所有的对象最终都是由。

2025-01-14 17:06:48 445

原创 前端项目部署方法

下载链接:[https://nginx.org/en/download.html](https://nginx.org/en/download.html)可以点击nginx.exe文件启动nginx,它可能会弹出一个提示是否允许,然后会闪一下。打包项目代码,然后把nginx.conf文件里面的地址换成dist文件的地址。然后关闭nginx,重启nginx,重新刷新页面即可,不会在出现404的问题。如果原本的80端口号被占用了,可以改为其他的端口号。然后重启nginx,再刷新页面就可以看到项目的页面。

2024-12-18 13:00:06 597

原创 身份认证,cookie,session,token

身份认证( Authentication )又称“身份验证”、“鉴权”,是指通过一定的手段,完成对用户身份的确认。日常生活中的身份认证随处可见,例如:高铁的验票乘车,手机的密码或指纹解锁,支付宝或微信的支付密码等。在 Web 开发中,也涉及到用户身份的认证,例如:各大网站的手机验证码登录、邮箱密码登录、二维码登录等。Cookie 是存储在用户浏览器中的一段不超过 4 KB 的字符串。

2024-12-08 22:52:03 1158

原创 你不知道的 CSS 之包含块

没错,因为我们对 div1 进行了定位,因此它会应用非根元素包含块计算规则的第三条规则,寻找离它最近的 position 的值不是 static 的祖先元素,不过显然 body 的定位方式为 static,因此 div1 的包含块最终就变成了初始包含块。首先 HTML 作为根元素,对应的包含块就是前面我们所说的初始包含块,而对于 body 而言,这是一个 static 定位的元素,因此该元素的包含块参照第一条为 html,以此类推 div1、p1、p2 以及 em1 的包含块也都是它们的父元素。

2024-12-01 11:16:57 891

原创 浏览器渲染过程

浏览器是怎么渲染页面的,什么是重排,什么是重绘

2024-11-30 13:00:00 779

原创 CSS 属性计算过程

你是否了解 CSS 的属性计算过程呢?上面的 CSS 代码中,p 是元素选择器,color 就是其中的一个 CSS 属性。但是要说 CSS 属性的计算过程,还真的不是很清楚。没关系,通过此篇文章,能够让你彻底明白什么是 CSS 属性的计算流程。

2024-11-29 15:04:38 1270

原创 async和await

Promise虽然解决了回调地狱的问题,但是存在Promise·的链式调用的问题,容易导致代码冗长、难以阅读和维护,这就是 async/await 出现的原因。async/await 让代码更少,更简洁,易于阅读。

2024-11-26 20:28:19 859

原创 定位position各个属性及其作用

在 viewport 视口滚动到元素 top 距离小于 10px 之前,元素为相对定位。之后,元素将固定在与顶部距离 10px 的位置,直到 viewport 视口回滚到阈值以下。可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位,之后为固定定位。是元素固定于浏览器可视区的位置。是元素在移动位置的时候,是相对于它原来的位置来说的(自恋型)。是元素在移动位置的时候,是相对于它祖先元素来说的(拼爹型)。相对定位的特点:(务必记住)绝对定位的特点:(务必记住)固定定位的特点:(务必记住)

2024-11-16 21:22:42 642

原创 在vue中修改Element UI组件默认样式的方法

【代码】在vue中修改Element UI组件默认样式的方法。

2024-11-16 20:42:19 507

原创 组件通信方式(父子组件通信,兄弟组件通信,跨多层级组件通信)

(1)父子组件间通信● 子组件通过 props 属性来接受父组件的数据,然后父组件在子组件上注册监听事件,子组件通过 emit 触发事件来向父组件发送数据。● 通过 ref 属性给子组件设置一个名字。父组件通过 $refs 组件名来获得子组件,子组件通过 $parent 获得父组件,这样也可以实现通信。● 使用 provide/inject,在父组件中通过 provide提供变量,在子组件中通过 inject 来将变量注入到组件中。

2024-11-12 16:27:05 1836

原创 js为什么要进行变量提升,它导致了什么问题

JavaScript 中变量声明提升的本质原因是 JavaScript 引擎在代码执行之前会进行解析,创建执行上下文,并初始化执行上下文中需要用到的对象。在 JavaScript 中,每个执行上下文都有一个对应的变量对象,存储了当前执行上下文中的所有变量和函数声明。当访问一个变量时,JavaScript 引擎会首先在当前执行上下文的变量对象中查找,如果找不到,则会沿着作用域链向上查找,直到找到变量为止。总之,作用域链的首端是当前执行上下文的变量对象,它是 JavaScript 变量查找过程中的起始位置。

2024-11-06 19:40:57 869

原创 Vue模板编译原理

在 Vue.js 中,模板是用来描述组件的结构和内容的一种声明式的、基于 HTML 的语法。模板可以包含 Vue.js 的指令、插值表达式、事件处理等内容,它是构建用户界面的重要组成部分。

2024-11-06 19:40:01 1004

原创 let,const,var的区别

声明的常量并不意味着它所指向的值是不可变的,而是指向的内存地址不可变。这意味着如果你声明一个基本类型(如数字、字符串等)的常量,你不能改变这个值,但如果声明的是一个对象或数组,你可以改变其属性或元素。声明的常量一般用于那些在程序执行过程中不应该被修改的值,但需要注意对象和数组等复合数据类型的特殊性。关键字用于声明常量,它创建的变量在赋值后不能再被修改。

2024-11-05 00:33:41 440

原创 JavaScript脚本延迟加载的方式有哪些

将JS脚本放在文档底部,来使JS脚本尽可能的在最后来加载执行。

2024-11-05 00:29:39 879

原创 JS类数组对象定义和转换

一个拥有 length属性和若干索引属性的对象就可以被称为类数组对象,类数组对象和数组类似但是不能调用数组的方法。常见的类数组对象有arguments和 DOM方法的返回结果,还有一个函数也可以被看作是类数组对象,因为它含有 length属性值,代表可接收的参数个数。

2024-11-05 00:28:14 932

原创 对this的理解和this指向

在 JavaScript 中,构造函数是用来创建对象的函数。关键字在构造函数中的作用,它指向了即将创建的实例对象,并允许我们给对象赋予特定的属性值。引用按钮元素,并对按钮进行了一些操作,如输出按钮的 id 并禁用按钮。是环境对象,函数内部特殊的变量,它代表着函数运行时所处的环境。// 在事件处理函数中,可以使用 this 来操作触发事件的元素。// 在事件处理函数中,this 指向触发事件的元素(即按钮)最后,通过访问对象的属性,我们可以看到。在这个例子中,当按钮被点击时,事件处理函数。

2024-11-05 00:26:34 513

原创 Array.prototype.push()的理解和手写

在定义函数时没有声明参数,但是在调用函数时可以传入参数。在 JavaScript 中,函数可以接受任意数量的参数,即使在函数定义中没有显式声明参数也可以在调用时传入参数。方法可以接受任意数量的参数,并将它们依次添加到数组的末尾。如果传入的参数是数组,则整个数组作为一个元素添加到数组的末尾。方法用于向数组的末尾添加一个或多个元素,并返回修改后数组的新长度。对象访问传入的参数,并进行相应的处理。因此,即使在函数定义中没有声明参数,也可以在调用函数时传入参数。实际上它是当前函数的一个内置对象。

2024-11-05 00:19:49 621

原创 Array.prototype.map()的用法和手写

是 JavaScript 中数组的原型方法之一,用于对数组中的每个元素执行指定的操作,并返回操作结果组成的新数组。方法常用于对数组中的元素进行转换、映射或处理,并生成一个新的数组,非常方便地实现了数据的转换和操作。数组中的每个元素都执行了一个函数,将每个元素的值加倍,并将结果存储在。

2024-11-05 00:18:38 623

原创 title和h1的区别

而如果将相同的标题放在``标签中,搜索引擎会更清楚地理解这个标题是页面的主标题,进而更好地理解页面的内容,从而提高页面在搜索结果中的排名和曝光率。因此,使用正确的标题层次结构(如将主要标题放在``标签中,次要标题放在``、``等标签中)可以提高页面在搜索结果中的可发现性和可读性。这句话的意思是,虽然`title`属性和``标签都可以用来表示页面中的标题,但它们在页面信息的抓取和搜索引擎优化方面具有不同的影响。

2024-11-05 00:15:54 404

原创 localStorage和sessionStorage的区别

总的来说,`localStorage`和`sessionStorage`都是前端常用的本地存储方式,根据数据的生命周期和作用域的不同选择合适的存储方案来满足业务需求。`localStorage`和`sessionStorage`都是浏览器提供的本地存储方案,它们之间有几个关键的区别,包括数据的生命周期、作用域以及存储容量等方面。- `sessionStorage`:存储容量比`localStorage`略小,通常在2MB~5MB左右。- **localStorage的用法:**- **存储容量:**

2024-11-05 00:14:28 707

原创 localStorage和sessionStorage的区别

非常简单,它们都提供了类似于 JavaScript 对象的 API,可以使用键值对的方式存储和检索数据。类似,只是使用的 API 名称略有不同。

2024-11-05 00:06:33 1017

原创 call(),bind(),apply(),的区别和手写

方法用于创建一个新函数,不会立即执行,并且可以绑定指定的。是 JavaScript 中用于改变函数执行上下文(即。方法用于立即调用函数并且改变函数执行上下文,而。

2024-11-05 00:04:15 405

原创 怎么使用git提交代码到github

要将代码提交到 GitHub 上,你需要先在本地使用 Git 进行一些操作,然后将代码推送到 GitHub 仓库。

2024-11-05 00:01:29 239

原创 git提交冲突的原因及解决方案

提交者的版本库 < 远程库要保障提交者的版本库信息和远程仓库是一致的。

2024-11-04 23:57:48 886

空空如也

空空如也

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

TA关注的人

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