张先生的前端日志

原创 基于Taro4打造的一款最新版微信小程序、H5的多端开发简单模板

基于Taro4、Vue3、TypeScript、Webpack5、Tailwind4打造的一款专注于Taro多端开发的简单模板

原创 Vue3、Vite5、Primevue、Oxlint、Husky9 简单快速搭建最新的Web项目模板

Vue3、Vite5、PrimeVue、Unocss、Oxlint、Husky9 简单搭建最新的Web项目模板

原创 uniapp-vue3-vite 搭建小程序、H5 项目模板

结合Vite、Vue3搭建的小程序、H5开发模板，旨在开箱即用、快速开发！

原创 React、React Router、JSX 简单入门快速上手

ReactJS 是一种由Facebook开发的JavaScript库，旨在提供一种高效、灵活的方式来构建用户界面

原创 最简单的Vuejs基础，小伙伴们快来看！！！

  Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。他的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。只关注视图层，它不仅易于上手，还便于与第三方库或项目整合。...

原创 Git常用命令指南

Git常用命令速查清单，包含仓库管理、配置、分支操作等核心功能。主要内容： 仓库操作：git init/clone 配置管理：git config设置用户信息 文件操作：add/rm/mv等命令 分支管理：创建/切换/合并分支 代码提交：commit/amend等操作 远程同步：push/pull/fetch命令 撤销修改：checkout/reset/revert 查看信息：status/log/diff等命令 该清单覆盖了Git日常开发中的主要操作场景，适合开发者快速查阅使用。

原创 for in弊端解析、封装对象循环方法

原创 用svg打造个人动态签名（禁止废话版）

实现antfu大佬网站上的这个签名的效果

原创 前端更新部署代码后通知用户刷新（禁止废话版）

将生成的dist包丢进服务器，项目功能发生改变之后通知用户刷新项目，在没有后端配合的情况下实现通知用户刷新

原创 你不知道的 JavaScript 工具管理器 Volta

Volta 是一个现代化的 JavaScript 工具管理器，提供了比传统 nvm 更好的性能和用户体验。通过使用 Volta 管理项目级别的 Node.js 版本，可以确保每个项目都有一个干净且独立的开发环境。

原创 Vue3结合OpenLayers加载GeoJson文件实现离线版世界地图（中国详细数据）以及聚合点位（内部有免费GeoJson资源整合）

OpenLayers 开源的处理二维地图的JavaScript库 的，开发旨在进一步利用各种地理信息。OpenLayers 可让您轻松地在任何网页中放置动态地图。它可以显示从任何来源加载的地图图块、矢量数据和标记。（就是更方便的加载、配置网页地图）

原创 Vue项目上传GitHub 自动化部署页面（禁止废话版）

CI/CD 是（Continuous Delivery，CD）或（Continuous Deployment，CD）的简称（就是全程自动化操作）

原创 炫酷的CSS loading加载动画（拒绝废话版）

这是一组效果非常酷的纯CSS3炫酷预加载Loading指示器动画特效，使用:before和:after伪元素，以及CSS帧动画来完成各种不同的预加载指示器动画。

原创 vue2、element的el-select 选项框的宽度设置、文本过长问题

【代码】vue2、element的el-select 选项框的宽度设置、文本过长问题。

原创 天地图、OpenLayers、Vue3实现地图标点出现弹窗

OpenLayers 是一个高性能、功能丰富的库，用于在 Web 上创建交互式地图。它可以在任何网页上显示从任何来源加载的地图图块。

原创 Vue3 接入西瓜播放器（xgplayer）封装组件

有兴趣可关注！！！

原创 Vue3自定义指令实现鼠标拖拽、触摸拖拽弹窗

【代码】Vue3自定义指令实现鼠标拖拽、触摸拖拽弹窗。

原创 Vite、Vue3离线、无网络使用 Iconify 图标（直接上手）

有时候打包部署内网项目，在无网络的情况下，在线图标会失效，此篇解决无网络情况下使用iconify.design

原创 Vue3、Vue I8n 国际化配置（很容易上手）

Vue I18 n是Vue.js的国际化插件。它可以轻松地将一些本地化功能集成到Vue.js应用程序中

原创 浏览器画中画？还有谁！！！

Document Picture-in-Picture API（文档画中画API）可以打开一个始终在顶部的窗口，该窗口可以填充任意HTML内容，它扩展了早期的 画中画API，专门支持将HTML 元素放入始终在顶部的窗口中。

原创 git 如何删除新已push的代码

在日常的开发中，我们经常使用Git来进行版本控制。有时候，我们可能会不小心将错误的代码 Push 到远程仓库，可以通过此命令重置不留痕迹

原创 vite生产环境报错 TypeError: Failed to fetch dynamically imported module: xxx

vue3 + vite项目，有时跳转页面会卡住

原创 Vite4、Vue3、Axios 针对请求模块化封装搭配自动化导入（简单易用）

简单处理Axios网络请求模块化，复制粘贴即可

原创 VueUse、View Transitions API实现暗黑模式主题动画切换效果

简单使用VueUse、View Transitions API进行的动画操作，复制粘贴即可

原创 Vue、fabricJS 画布实现自由绘制折线

canvas的封装版，更容易、更简单！！！

原创 Vue Router使用VueUse更改标签页名称的工具函数

Vue Router使用VueUse更改标签页名称的工具函数。

原创 Vue 项目中如何使用Bootstrap5（简单易懂）

简洁、直观、强悍的前端开发框架，让web开发更迅速、简单

原创 主打的就是一蠢

涨知识了

原创 JavaScript API 获取当前地理位置

js 获取当前地理位置

原创 Vue中使用Echarts封装为公用组件（简单复制粘贴）

针对一个基于 JavaScript 的开源可视化图表库（Echarts）的简单组件封装，复制粘贴，快速上手使用

原创 Vue底层术语解析以及存在关系

主要旨在简单理解Vue底层相关术语以及之间的关系，虚拟DOM、渲染函数、diff、抽象语法树（AST）

原创 Vue3中快速简单使用CKEditor 5富文本编辑器

CKEditor 5就是内嵌在网页中的一个富文本编辑器工具接下来带你快速熟悉CKEditor 5在Vue3中简单使用

原创 CSS权重以及优先级的关系

所谓CSS优先级，即是指CSS样式在浏览器中被解析的先后顺序；浏览器是通过优先级来判断哪些CSS样式应用到该元素上的。优先级就是分配给指定的CSS声明的一个权重，它由匹配的选择器中的每一种选择器类型的数值决定。CSS权重指的是CSS选择器的优先级，优先级高的CSS样式会覆盖优先级底的CSS样式，优先级越高说明权重越高

原创 GitHub添加SSH（Windows版 简单易懂）

使用 SSH 协议可以连接远程服务器和服务并向它们验证。 利用 SSH 密钥可以连接到 GitHub，而无需在每次访问时都提供用户名和 personal access token。还可以使用 SSH 密钥对提交进行签名

转载 我终于搞懂了async/await、promise和setTimeout的执行顺序

javascript是一门单线程语言，在最新的HTML5中提出了Web-Worker，但javascript是单线程这一核心仍未改变。所以一切javascript版的"多线程"都是用单线程模拟出来的，一切javascript多线程都是纸老虎！

原创 Vue源码解析—new Vue()响应性数据劫持

在 new Vue() 之后。 Vue 会调用 _init 函数进行初始化，也就是这里的 init 过程，它会初始化生命周期、事件、 props、 methods、 data、 computed 与 watch 等。其中最重要的是通过 Object.defineProperty 设置 setter 与 getter 函数，用来实现「响应式」以及「依赖收集」，后面会详细讲到，这里只要有一个印象即可。

原创 Vue2、Vue3中v-model的本质以及作用在组件上的用法（简单易懂）

在表单输入元素或组件上创建双向绑定

原创 简单易懂的JavaScript原型以及原型链

原型以及原型链的简单理解。

原创 json web token前端鉴权流程（超容易理解）

一文熟悉json web token前端鉴权

原创 sass/scss预处理器的简单理解

世界上最成熟、最稳定、最强大的专业级CSS扩展语言！