I am trying to add TypeScript to a large Vue 3 app which is using the options API. I think I have things largely working ok (I can serve the app and see it in the browser), but there seems to be a small config issue I can't get past.
In my root tsconfig.json file, there is an error for the tsconfig.app.json reference which says:
"Referenced project ... may not disable emit".
If I add "noEmit": false
to the compilerOptions
section in tsconfig.app.json then the error in the root tsconfig.json file goes away. However, I then get an error in the tsconfig.app.json file which says
"Option 'allowImportingTsExtensions' can only be used when either 'noEmit' or 'emitDeclarationOnly' is set"
I'm not explicitly using the allowImportingTsExtension
option in any of my own configs, and in this case I am setting noEmit
, so this error seems somewhat unusual.
Not sure how I can past these errors? For reference, here are my configs:
tsconfig.json
{
"files": [],
"references": [
{
"path": "./tsconfig.node.json"
},
{
"path": "./tsconfig.app.json"
}
]
}
tsconfig.app.json
{
"extends": "@vue/tsconfig/tsconfig.dom.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
"exclude": ["src/**/__tests__/*"],
"compilerOptions": {
"outDir": "./wwwroot/dist",
"allowJs": true,
"strict": false,
"noEmit": false,
"composite": true,
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
}
}
}
The app is using Vue 3.5.6, and the following devDependencies:
package.json
"devDependencies": {
"@tsconfig/node20": "20.1.4",
"@types/node": "22.9.0",
"@vitejs/plugin-vue": "5.2.0",
"@vue/tsconfig": "0.6.0",
"rollup-plugin-copy": "3.5.0",
"sass": "1.79.1",
"typescript": "5.6.3",
"vite": "5.4.11",
"vite-plugin-vue-devtools": "7.6.4",
"vue-tsc": "2.1.10"
}
The solution at this point seems to be to explicitly disable allowImportingTsExtensions
in the tsconfig.app.json file. the noEmit
option should also be explicitly disabled.
With both of these options configured, I have no errors in either the root tsconfig, or tsconfig.app files.
See this issue in the Vue github: https://github.com/vuejs/tsconfig/issues/10