[Mores] 最近的动态
Mores文章Vue移动端适配vw和 postcss-px-to-viewport使用
vw 适配 vs rem 适配 Vue 移动端做适配,传统方案是 lib-flexible + postcss-px2rem (动态调 html 根字号 + 转 rem)。但社区慢慢转向更纯粹的方案: 用 vw 单位 ,完全不依赖运行时 JS。 vw(viewport width)是 CSS 单位, 1vw = 视口宽度的 1% 。比如视口 375px 宽, 1vw = 3.75px 。直接用 vw 替代 px,浏览器原生适配,不需要任何 JS 介入。 对比:
- Mores文章
解决Vue项目每次更新浏览器缓存问题
问题:用户死活看不到新版本 SPA 项目部署完,产品经理说他改不出新的功能。F12 一看,加载的还是上次发布的 app.123abc.js ,新 commit 完全没生效。让他强刷一下 (Ctrl+F5) 立刻就好,但你没法要求所有用户都来这一下。 本质是 浏览器缓存 没失效。Vue / Webpack 默认 hash 文件名( app.[hash].js )按理说能自动 cache-bust,但很多项目里: 构建 hash 策略没开,文件名一直是 app
- Mores文章
护眼宝 V3.1.2 官方版
护眼宝是一款专门用来缓解用眼疲劳的小工具。长时间盯屏幕的人,眼睛干涩、酸胀基本是常态——这类软件的思路是通过调节屏幕色温、亮度,再加上定时提醒,把"强制休息"安排进你的工作节奏里。 主要功能 五种护眼模式 :打开软件后可在五种预设模式间切换,适配不同光线环境和用眼场景。 用眼时长统计 :实时记录当天累计用电脑的时间,到点提醒你该歇了。 眼保健操引导 :内置眼保健操教程,跟着做能放松眼周肌肉。 主界面能直接看到当天已用电脑的时间:
- Mores文章
前端项目使用await-to-js异步代码优化利器
痛点:async/await 的 try/catch 包装 用 async/await 写代码很爽,但每个调用要包 try/catch 处理异常,代码很快就会变成下面这样: async function getList() { try { const res = await getAListOfClassifiedItems({ p1, p2 }) if (res.data.code === 200) { // 处理成功 } else { console.e
- Mores文章
域名DNS解析中DNS隐/显性 URL记录
场景 大部分人都拿过这个需求:站点同时有顶级域名( example.com )和 www 二级( www.example.com ),为了不让搜索引擎把这俩当成两个站、分散权重,需要把其中一个 301 跳到另一个。 常规做法是在 Web 服务器(Nginx / Apache / IIS)里写一条 301 规则。但 很多 DNS 服务商提供的"URL 转发"记录可以不走服务器层,直接在 DNS 解析时就完成跳转 。配置极简单,不用动 Web 服务器配置,适合临时需求或者
- Mores文章
vue3+typescript+pnpm详细介绍使用
为什么用 pnpm 不用 npm/yarn pnpm 的核心优势两个 —— 快 、 省磁盘 。原理: 硬链接 + 内容寻址 —— 全局只存一份每个版本的包,项目里的 node_modules 实际是硬链接指向那份。装第二个项目时,相同的依赖直接复用,速度极快。 严格的依赖隔离 —— 不像 npm 把所有依赖平铺到 node_modules 根目录,pnpm 严格只暴露 package.json 里声明过的依赖。这能防止"幽灵依赖"(代码里
- Mores文章
解决Nuxt3项目创建项目失败链接失败等问题
问题:创建 Nuxt 3 项目卡在网络 用 npx nuxi init my-app 创建新项目时,经常卡在拉模板这一步。控制台报错通常是: fetch failed Error: ENOTFOUND raw.githubusercontent.com connect ETIMEDOUT 185.199.108.133:443 这是 GitHub 提供的几个域名( raw.githubusercontent.com 、 github
- Mores文章
Vue2移动端使用felxbilejs自适应
背景 Vue 2 项目要做移动端,设计稿通常是 750px 宽。每次写样式时都要算"设计稿 32px 等于实际多少 rem",效率太低。用 lib-flexible + postcss-px2rem 这套组合,代码里直接写 px,运行时自动适配各种屏幕。 注:lib-flexible 在 Vue 3 项目里改用 amfe-flexible + postcss-pxtorem ,本文是 Vue 2 + Webpack 老项目方案。 装两个包
- Mores文章
Nuxt3.js移动端Pc端自适应解决方案：使用flexible.js和postcss-pxtorem实现傻瓜式Px转Rem
需求场景 Nuxt 3 项目,设计稿移动端是 750 像素宽,Pc 端是 1920 像素宽,要在一个项目里都跑 —— 移动端写 32px 字号自动按比例缩放,Pc 端原样显示。 核心思路: flexible.js 根据设备宽度动态设置根字号 html.style.fontSize ,然后用 postcss-pxtorem 在构建期把代码里的 px 自动转 rem 。这样写代码时永远写 px,运行时自动适配。 方案核心:flexible.j
- Mores文章
前端解决无法创建Nuxt3项目！
问题:npm create nuxt 老是失败 新人创建 Nuxt 3 项目时常踩的坑: npm create nuxt-app@latest 或 npx nuxi init my-app 执行到一半卡住,或者直接报 fetch failed 。原因基本是 从 GitHub 拉模板时被卡了 ( raw.githubusercontent.com 国内访问不稳)。 方案 1:用 ghproxy 加速 Nuxi 内部用 giget 拉模板,可以设置 Gi
