把一套静态模板迁到 Vue 3 时踩的三个坑
2026-11-09
第一个坑是资源路径:SFC 模板里写 src="Assets/x.png",构建工具会当成模块去解析,路径不存在就直接编译失败,必须写成 /Assets/x.png 走 public 目录。
第二个是固定定位的抽屉只能靠 class 驱动:初始用 hidden 属性隐藏,打开时若不移除,CSS 过渡不会触发。
个人技术笔记 · 前端 / 全栈 / 工具链
这里是我自己的技术笔记站,用来记录学习和工作中遇到的问题、解决过程,以及一些零散的思考。
内容都是个人原创或学习摘录,不涉及任何商业推广与经营内容。网站为静态页面,没有注册、登录、评论等交互功能。
2026-11-09
第一个坑是资源路径:SFC 模板里写 src="Assets/x.png",构建工具会当成模块去解析,路径不存在就直接编译失败,必须写成 /Assets/x.png 走 public 目录。
第二个是固定定位的抽屉只能靠 class 驱动:初始用 hidden 属性隐藏,打开时若不移除,CSS 过渡不会触发。
2026-11-08
给每个元素各建一个观察器,比一个观察器管一批元素要慢不少。更常见的问题是回调里做同步布局读取,每次触发都强制重算样式。
把元素查询挪到挂载时做一次、回调里只做 class 切换,滚动就会顺很多。
2026-11-07
标题用的拉丁字体没有中文字形,浏览器会逐字回退到系统字体,字号和字重看起来会跳。稳妥的做法是在 font-family 里显式补上中文回退链。
另外,为拉丁文调的字距(比如 0.18em)用在大字号中文上会显得很散,通常收到接近 0 更合适。
有问题想交流,可以发邮件到 641531008@qq.com。