Vue项目仅App.vue中TypeScript报错，其余文件正常求助

首先，我一眼就注意到你代码里最关键的问题：App.vue的<script>标签没有指定lang="ts"属性！

因为Vue CLI默认只会把带lang="ts"的script块当作TypeScript处理，没有这个属性的话，编译器会把它当成普通JavaScript解析。而JavaScript并不支持a: string = ""这种类型标注语法，自然就会抛出Unexpected token的错误。

第一步：修复script标签 #

把你的App.vue里的script标签改成这样：

<template src="./App.html"></template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
@Component()
export default class App extends Vue {
  a: string = "";
  mounted() {}
}
</script>

添加lang="ts"后，vue-loader就会调用ts-loader来处理这段代码，TypeScript的语法就能被正确解析了。

如果还是有问题？排查其他可能 #

如果已经加了lang="ts"但错误依然存在，可以按下面的步骤排查：

• 确认依赖安装完整：确保你的项目里已经安装了vue-class-component、vue-property-decorator和@vue/cli-plugin-typescript，这些是Vue+TypeScript类组件风格的必备依赖。可以运行npm ls vue-class-component vue-property-decorator @vue/cli-plugin-typescript检查版本是否匹配。
• 检查tsconfig配置：你的tsconfig已经开了experimentalDecorators: true，这是对的，但可以确认include数组里包含了src/**/*.vue（你已经加了，没问题）。
• 清理缓存：有时候webpack的缓存会导致奇怪的问题，试试运行npm run serve --no-cache，或者手动删除node_modules/.cache目录后重新启动服务。
• 确认Vue CLI版本：如果是比较旧的Vue CLI版本，可能对TypeScript的支持有bug，建议升级到最新的稳定版（比如@vue/cli@4.x或5.x，对应你的Vue版本）。

我之前在维护Vue+TypeScript项目时也遇到过类似的情况，就是某个组件忘了加lang="ts"导致类型标注报错，加上之后就完全正常了。结合你说的其他组件都能正常运行，大概率就是App.vue的script标签没指定语言类型的问题。

内容的提问来源于stack exchange，提问作者Demiro-FE-Architect