-# experiments-playground
+# Experiments playground
-This template should help get you started developing with Vue 3 in Vite.
+This is a playground for the `vue-router/experimental` features.
-## Recommended IDE Setup
-
-[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
-
-## Type Support for `.vue` Imports in TS
-
-TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
-
-## Customize configuration
-
-See [Vite Configuration Reference](https://vite.dev/config/).
-
-## Project Setup
+## Setup
```sh
pnpm install
```
-### Compile and Hot-Reload for Development
+### Run the Playground
```sh
pnpm dev
```
-
-### Type-Check, Compile and Minify for Production
-
-```sh
-pnpm build
-```
"@types/node": "^22.15.32",
"@vitejs/plugin-vue": "^6.0.0",
"@vue/tsconfig": "^0.7.0",
- "npm-run-all2": "^8.0.4",
"typescript": "~5.8.0",
"vite": "^7.0.0",
"vite-plugin-vue-devtools": "^7.7.7",
} from 'vue-router/experimental'
import PageHome from '../pages/(home).vue'
-// type ExtractMatcherQueryParams<T> =
-// T extends MatcherPatternQuery<infer P> ? P : never
-
-// type CombineMatcherParams<T extends readonly MatcherPatternQuery[]> =
-// T extends readonly [infer First, ...infer Rest]
-// ? First extends MatcherPatternQuery
-// ? Rest extends readonly MatcherPatternQuery[]
-// ? ExtractMatcherQueryParams<First> & CombineMatcherParams<Rest>
-// : ExtractMatcherQueryParams<First>
-// : never
-// : {}
-
const PAGE_QUERY_PATTERN_MATCHER: MatcherPatternQuery<{ page: number }> = {
match: query => {
const page = Number(query.page)
},
}
-// function combineQueryMatchers<const T extends MatcherPatternQuery[]>(
-// ...matchers: T
-// ): MatcherPatternQuery<CombineMatcherParams<T>> {
-// return {
-// match: (query: MatcherQueryParams): CombineMatcherParams<T> => {
-// return matchers.reduce((acc, matcher) => {
-// return { ...acc, ...matcher.match(query) }
-// }, {} as CombineMatcherParams<T>)
-// },
-// build: (
-// params: CombineMatcherParams<T>
-// ): Record<string, string | string[]> => {
-// return matchers.reduce(
-// (acc, matcher) => {
-// return { ...acc, ...matcher.build(params) }
-// },
-// {} as Record<string, string | string[]>
-// )
-// },
-// }
-// }
-//
-// const a = combineQueryMatchers(
-// PAGE_QUERY_PATTERN_MATCHER,
-// QUERY_PATTERN_MATCHER
-// )
-
const ANY_HASH_PATTERN_MATCHER: MatcherPatternHash<// hash could be named anything, in this case it creates a param named hash
{ hash: string | null }> = {
match: hash => ({ hash: hash ? hash.slice(1) : null }),
'@vue/tsconfig':
specifier: ^0.7.0
version: 0.7.0(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3))
- npm-run-all2:
- specifier: ^8.0.4
- version: 8.0.4
typescript:
specifier: ~5.8.0
version: 5.8.3
json-parse-even-better-errors@2.3.1:
resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==}
- json-parse-even-better-errors@4.0.0:
- resolution: {integrity: sha512-lR4MXjGNgkJc7tkQ97kb2nuEMnNCyU//XYVH0MKTGcXEiSudQ5MKGKen3C5QubYy0vmq+JGitUg92uuywGEwIA==}
- engines: {node: ^18.17.0 || >=20.5.0}
-
json-schema-traverse@1.0.0:
resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==}
mdurl@2.0.0:
resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
- memorystream@0.3.1:
- resolution: {integrity: sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==}
- engines: {node: '>= 0.10.0'}
-
meow@8.1.2:
resolution: {integrity: sha512-r85E3NdZ+mpYk1C6RjPFEMSE+s1iZMuHtsHAqY0DT3jZczl0diWUZ8g6oU7h0M9cD2EL+PzaYghhCLzR0ZNn5Q==}
engines: {node: '>=10'}
resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
engines: {node: '>=0.10.0'}
- npm-normalize-package-bin@4.0.0:
- resolution: {integrity: sha512-TZKxPvItzai9kN9H/TkmCtx/ZN/hvr3vUycjlfmH0ootY9yFBzNOpiXAdIn1Iteqsvk4lQn6B5PTrt+n6h8k/w==}
- engines: {node: ^18.17.0 || >=20.5.0}
-
- npm-run-all2@8.0.4:
- resolution: {integrity: sha512-wdbB5My48XKp2ZfJUlhnLVihzeuA1hgBnqB2J9ahV77wLS+/YAJAlN8I+X3DIFIPZ3m5L7nplmlbhNiFDmXRDA==}
- engines: {node: ^20.5.0 || >=22.0.0, npm: '>= 10'}
- hasBin: true
-
npm-run-path@5.3.0:
resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
randombytes@2.1.0:
resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==}
- read-package-json-fast@4.0.0:
- resolution: {integrity: sha512-qpt8EwugBWDw2cgE2W+/3oxC+KTez2uSVR8JU9Q36TXPAGCaozfQUs59v4j4GFpWTaw0i6hAZSvOmu1J0uOEUg==}
- engines: {node: ^18.17.0 || >=20.5.0}
-
read-pkg-up@3.0.0:
resolution: {integrity: sha512-YFzFrVvpC6frF1sz8psoHDBGF7fLPc+llq/8NB43oagqWkx8ar5zYtsTORtOjw9W2RHLpWP+zTWwBvf1bCmcSw==}
engines: {node: '>=4'}
resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
engines: {node: '>=8'}
- shell-quote@1.8.3:
- resolution: {integrity: sha512-ObmnIF4hXNg1BqhnHmgbDETF8dLPCggZWBjkQfhZpbszZnYur5DUljTcCHii5LC3J5E0yeO/1LIMyH+UvHQgyw==}
- engines: {node: '>= 0.4'}
-
shiki@2.5.0:
resolution: {integrity: sha512-mI//trrsaiCIPsja5CNfsyNOqgAZUb6VpJA+340toL42UpzQlXpwRV9nch69X6gaUxrr9kaOOa6e3y3uAkGFxQ==}
json-parse-even-better-errors@2.3.1: {}
- json-parse-even-better-errors@4.0.0: {}
-
json-schema-traverse@1.0.0: {}
json-stringify-safe@5.0.1: {}
mdurl@2.0.0: {}
- memorystream@0.3.1: {}
-
meow@8.1.2:
dependencies:
'@types/minimist': 1.2.2
normalize-path@3.0.0: {}
- npm-normalize-package-bin@4.0.0: {}
-
- npm-run-all2@8.0.4:
- dependencies:
- ansi-styles: 6.2.1
- cross-spawn: 7.0.6
- memorystream: 0.3.1
- picomatch: 4.0.2
- pidtree: 0.6.0
- read-package-json-fast: 4.0.0
- shell-quote: 1.8.3
- which: 5.0.0
-
npm-run-path@5.3.0:
dependencies:
path-key: 4.0.0
dependencies:
safe-buffer: 5.2.1
- read-package-json-fast@4.0.0:
- dependencies:
- json-parse-even-better-errors: 4.0.0
- npm-normalize-package-bin: 4.0.0
-
read-pkg-up@3.0.0:
dependencies:
find-up: 2.1.0
shebang-regex@3.0.0: {}
- shell-quote@1.8.3: {}
-
shiki@2.5.0:
dependencies:
'@shikijs/core': 2.5.0