I have a Vue 2 project that I am in the process of upgrading to Vue 3. Because the Vue CLI is end of life, I have decided to migrate to Vite. There were a lot of breaking changes, so pretty much every file in my /src folder needs some degree of refactoring.
I would like to work on one section at a time, and I do not want vue-tsc to try transpiling any code that is not a dependency of any output files. Presently, it's trying to transpile EVERY .ts and .vue file in my /src folder. Is there a way to configure my project to work the way I am describing?
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
build: {
outDir:'../wwwroot/dist',
rollupOptions: {
input: {
cards: fileURLToPath(new URL('./src/pages/cards/cards.ts', import.meta.url)),
},
output: {
entryFileNames: `[name].js`,
chunkFileNames: `chunks/[name].js`,
assetFileNames: `assets/[name].[ext]`
}
},
},
})
My question is a bit of a misnomer because while the error is emitted from running the scripts Vite build process, it's vue-tsc that causes it.
My scripts section of package.json looks like this:
"dev": "vite",
"build": "run-p type-check build-only",
"watch": "vite build --watch",
"preview": "vite preview",
"build-only": "vite build --emptyOutDir",
"type-check": "vue-tsc --noEmit",
As part of the build process, vue-tsc (Vue's ts compiler for SFCs) runs. It picks up everything, even files that are not used in the project. So just using the build-only
command runs the build and skips the type checking.