今天在使用 vite 创建项目并打包时，遇到如下错误。
Error: VirtualCode id must be lowercase: scriptSetupFormat
看这个字面意思是我的 setup 必须使用写，也就是要像下面这样子
<script setup lang="ts">
于是排查所有页面与组件后并没有使用大写。追踪源代码后发现是volarjs/volar.js@1f6e2bf 的 verifyVirtualCode 方法中有出了问题
function verifyVirtualCode(virtualCode: VirtualCode) {
for (const code of forEachEmbeddedCode(virtualCode)) {
if (code.id !== code.id.toLowerCase()) {
throw new Error(`VirtualCode id must be lowercase: ${code.id}`);
}
}
}
网上看了大家与一我遇到的问题差不多。源问题链接。因为他们是使用 pnpm 或者 npm 安装的。解决方案是需要在 package.json 中增加如下代码做一个包的替换：
"pnpm": {
"overrides": {
"@volar/typescript": "2.3.1",
"@volar/language-core": "2.3.1"
}
}
但是我实践后并不生效。因为我项目是使用 yarn 安装的，即使是换pnpm安装也不好使。于是我把 node_modules 目录删除后, 重新执行
yarn && yarn upgrade
这个问题就没有了。