Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(dev): check component types in playground.vue #16843

Merged
merged 9 commits into from
Mar 21, 2023
Merged

chore(dev): check component types in playground.vue #16843

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
a94b11b
Add script config
yuwu9145 Mar 5, 2023
aad2044
use unplugin-vue-components to generate components.d.ts
yuwu9145 Mar 8, 2023
26d33bb
Remove .ts suffix in import path
yuwu9145 Mar 8, 2023
c121171
Try to automatically get the full list of compoentns types
yuwu9145 Mar 8, 2023
f07ca60
ignore components.d.ts
yuwu9145 Mar 9, 2023
60374bb
Adjust eslintignore
yuwu9145 Mar 9, 2023
565cc69
add comment
yuwu9145 Mar 9, 2023
1a8d927
Merge branch 'master' into type-check-script
KaelWD Mar 21, 2023
a83e8e5
use existing eslintignore
KaelWD Mar 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions packages/vuetify/dev/components.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'

declare module '@vue/runtime-core' {
export interface GlobalComponents {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
VApp: typeof import('@/components/VApp/index')['VApp']
VAutocomplete: typeof import('@/components/VAutocomplete/index')['VAutocomplete']
VBtn: typeof import('@/components/VBtn/index')['VBtn']
VMain: typeof import('@/components/VMain/index')['VMain']
}
}

export {}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just add this to gitignore, otherwise it'll change every time you modify the playground

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also eslintignore

Copy link
Member Author

@yuwu9145 yuwu9145 Mar 9, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also eslintignore

this file will be ignored by git so it doesn't bother lint command in CI. Assuming this is for IDE experience, then a .eslintignore file should be placed in root directory

1 change: 1 addition & 0 deletions packages/vuetify/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@
"dev": "cross-env NODE_ENV=development vite",
"dev:ssr": "cross-env NODE_ENV=development VITE_SSR=true vite-ssr",
"dev:prod": "concurrently \"cross-env NODE_ENV=production vite build -w\" \"vite preview\"",
"dev:typecheck": "vue-tsc --noEmit --skipLibCheck --project ./tsconfig.dev.json",
"build": "rimraf lib dist && concurrently \"yarn build:dist\" \"yarn build:lib\" -n \"dist,lib\" --kill-others-on-fail -r && yarn build:types",
"build:dist": "rollup --config build/rollup.config.js",
"build:lib": "cross-env NODE_ENV=lib babel src --out-dir lib --source-maps --extensions \".ts\",\".tsx\",\".snap\" --copy-files --no-copy-ignored --out-file-extension .mjs",
Expand Down
8 changes: 7 additions & 1 deletion packages/vuetify/tsconfig.dev.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,11 @@
"src",
"dev",
"cypress"
]
],
"compilerOptions": {
"allowJs": true
},
"vueCompilerOptions": {
"strictTemplates": true
}
}
4 changes: 2 additions & 2 deletions packages/vuetify/vite.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ const components = files.filter(file => file.startsWith('src/labs') || !block.so
const map = new Map(components.flatMap(file => {
const src = readFileSync(file, { encoding: 'utf8' })
const matches = src.matchAll(/export const (V\w+)|export { (V\w+) }/gm)
return Array.from(matches, m => [m[1] || m[2], file.replace('src/', '@/')])
return Array.from(matches, m => [m[1] || m[2], file.replace('src/', '@/').replace('.ts', '')])
Copy link
Member Author

@yuwu9145 yuwu9145 Mar 8, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To assist vue-tsc work properly, have to remove .ts suffix for import paths, so unplugin-vue-components can yield

VBtn: typeof import('@/components/VBtn/index')['VBtn'] 👍
as opposed to
VBtn: typeof import('@/components/VBtn/index.ts')['VBtn'] 👎

TS 4.x does not support .ts suffix in import path, and it looks like to be one of tasks in TS 5.x roadmap

Issue: microsoft/TypeScript#37582
PR: microsoft/TypeScript#51669

More importantly, this change does not break yarn dev

}))

export default defineConfig(({ mode }) => {
Expand All @@ -45,7 +45,7 @@ export default defineConfig(({ mode }) => {
vueJsx({ optimize: false, enableObjectSlots: true }),
viteSSR(),
Components({
dts: false,
dts: true,
resolvers: [
name => {
if (map.has(name)) {
Expand Down