webpack项目转为vite
背景 最近公司有新项目，在技术选型上选择了vite+vue3，vite的好处就不多说了 ，新项目创建后运行报错，本地node版本太老了，升级node后可以运行了但是以前的其他项目没法运行和打包了，没办法又装了nvm，切换node…
Vite 不支持 require 解决方案
require() Node.JS 原生方法，以CommonJS方式加载模块/文件/图片； Webpack 默认支持，Vite不支持； 报错Uncaught (in promise) ReferenceError: require is not defined require()加载模块 const OSS = require(…
vite构建打包优化
打包优化老生常谈的问题了，随着项目迭代，业务逻辑复杂度的提升代码越来越多，无论是webpack还是vite打包都会遇到打包文件太大从而导致首页加载缓慢，打包优化可从代码压缩，文件压缩 这两种方式着手，废话不…
vue3发送短信验证码倒计时
新项目选用了vue3，正好写到短信验证码倒计时这种常见功能，就借鉴vue3新组合API的方式封装一下这类功能。废话不多说，直接上代码 创建一个单独的文件 //getcode/index.js import {ref, computed, onUnmounted } …
浅谈前端模块化
我们知道，在NodeJS之前，由于没有过于复杂的开发场景，前端是不存在模块化的，后端才有模块化。NodeJS诞生之后，它使用CommonJS的模块化规范。从此，js模块化开始快速发展。 模块化的开发方式可以提供代码复用…
Webpack 核心配置总结与补充
一、核心配置项 Entry（入口） 作用：指定打包入口文件。 默认值：./src/index.js 配置形式： 字符串：单入口（默认）。 数组：多入口合并为一个输出文件（如 ["./src/a.js", "./src/b.js"]）。 对象：…
15 个有用的 CSS 属性
在网页开发的世界里，CSS 的强大功能和灵活性日益显著。然而，一些 CSS 属性往往被忽视或低估。本文将重点介绍 15 个开发者应该了解但经常被忽略的有用 CSS 属性。这些属性提供了强大的工具来增强网站的设计、性能…
解决vue3引入sockjs-client报错问题(global is not defined)
今天在 vue3 中引入 sockjs-client 的时候莫名的报了个错，而且页面里也没有 global 相关的内容，使得 sockjs-client 无法使用。报错信息如下： Uncaught ReferenceError: global is not defined at node_modu…
如何防止 XSS 攻击
作为前端开发者，我们不仅致力于创造视觉吸引且交互性强的应用界面，还必须将应用安全放在首位。跨站脚本攻击（XSS）是网络安全的重大威胁之一，它允许攻击者将恶意脚本注入到我们的应用中，这可能导致用户数据被盗…
web访问过程详解
很多时候，初级的前端开发工程师能够理解的web访问过程仅仅是浏览器和服务器之间的数据交互，通过浏览器发送HTTP请求到服务器，等待服务器返回数据，浏览器解析数据渲染页面。 本文我们详细的聊聊用户访问网站应用…
尝试pnpm
起因是维护的项目越来越多，每个项目都install一次，每个项目都有node_modules，我的磁盘快满了，而且不知怎么回事有个项目的node_modules居然占了好几个G？？！！我果断删了重新装，但是装了好长时间......，这又…
移动端h5多个输入框填验证码
最近移动端项目需要改版，以前用的UI库不符合现在的设计图，改着太费劲想了想还是自己封装快一些，下面只针对输入框实现进行代码说明其他样式省略 实现思路 方式一：多个input框，每个输入框限制输入数字和…
