Vue 3.5.23 模板明明写对了，却报 Expected ] but found }

Vue 项目只更新了补丁版本，原来能构建的组件突然报错：

[vite:esbuild] Transform failed with 1 error
ERROR: Expected "]" but found "}"

错误位置可能落在带有 ?vue&type=script&setup=true&lang.ts 的生成文件中。查看源码时，数组下标的方括号却是完整的。如果依赖树里正好是 Vue 3.5.23，而且模板表达式用了 TypeScript 的 as 或非空断言，就要考虑这一版的编译器回归。

同一回归也会影响带 v-model 类型断言的表达式，报出 Expected "]" but found ":"。检查对应的生成代码，可以发现右方括号已经丢失。报错中的 esbuild 是发现语法损坏的下一环，不能仅凭错误前缀就把原因归给 esbuild。

下面这种模板表达式可以暴露问题：

<script setup lang="ts">
import { ref } from 'vue'

const bar = { title: 'hello' }
const baz = ref<'title'>('title')
</script>

<template>
  <div :data-foo="bar[baz] as string">内容</div>
</template>

3.5.23 的相关转换会把表达式处理成缺少 ] 的代码。编译器原本要处理 TypeScript 类型断言，字符串切片却截掉了表达式的一部分。Vue 在 3.5.24 回退了引入问题的修改，这个修复版本发布于 2025 年 11 月 7 日。

先核对运行时和编译器，不要只检查一个包：

npm ls vue @vue/compiler-sfc @vue/compiler-core

如果是直接维护 Vue 的 Vite 项目，可以在修复分支中将 Vue 更新到已确认修复的 3.5.24：

npm install vue@3.5.24
npm run build

项目若显式依赖 @vue/compiler-sfc，需要同步检查它的版本。Monorepo 里还应逐个工作区核对；某个工具继续解析到 3.5.23 时，顶层显示新版本不代表所有组件都已使用新编译器。Nuxt 等由框架管理 Vue 依赖的项目，应沿框架支持的升级方式处理，避免强制覆盖一组未经验证的编译器包。

临时绕开时，可以把类型断言移到脚本区，例如为展示值建立 computed，让模板只绑定计算后的值。但不要机械删除所有 ! 或把双向绑定换成只读计算属性；这些改动可能改变原有空值约束或 v-model 的写入行为。能正常升级时，修复编译器通常比逐处改写模板更直接。

验证不能停在开发服务器能启动。重新执行生产构建，再检查原来带下标和断言的绑定是否生成完整代码，并确认对应页面的属性值、文本与输入更新正常。此次回归也可能不阻断构建，却产生意外文本，所以构建通过仍需检查实际输出。

如果项目并未安装 3.5.23，或者生成代码中的方括号完整，应回到真实的模板语法、插件版本和错误位置继续排查。这一版本结论不能解释所有 Expected ] 报错。