Layout inside +config.ts says invalid type, and doesn't wrap Page.

[traviscooper]

Description

// +config.ts
import type { Config } from 'vike/types';
import Page from './page'
import Layout from './layout'

export default {
    Page,
    Layout,
    // Parameterized route that matches URLs such as /product/1337 and /product/macbook
    route: '/star-wars/@id',
    meta: {
        Layout: {
            env: { server: true, client: true }
        }
    }
} satisfies Config;

1. Above Layout causes type error, Layout not on type Config
2. In practice, the Layout component (which simply wraps {children}) isn't used.
3. Config (layout) implies that the above should work.

Versions:

"vike": "^0.4.167",
"vite": "^5.0.10" 

[traviscooper]

Also, if I remove the meta field, as suggested is possible in the Config docs, I get the following error:

[vike][config][Wrong Usage] /pages/star-wars/@id/+config.ts defines an unknown config Layout, you need to define the config Layout by using config.meta https://vike.dev/meta

Should this +config.ts layout work? I think that's the goal?

import type { Config } from 'vike/types';
import Page from './page'
import Layout from './layout'

export default {
    Page,
    Layout,
    route: '/star-wars/@id',
} as Config;

[brillout]

You need to use vike-{react,vue,solid} or implement it yourself.

I'll improve the docs about this.

[traviscooper]

Appreciate the quick response!

Is there a doc showing what I'm missing with vite-react to achieve the above?

[traviscooper]

Ahh, is this the best example, just need to have the config extends vikeReact?

import type { Config } from 'vike/types'
import Layout from '../layouts/LayoutDefault'
import Head from '../layouts/HeadDefault'
import vikeReact from 'vike-react/config'

// Default configs (can be overridden by pages)
export default {
  Layout,
  Head,
  // <title>
  title: 'My Vike + React App',
  ssr: true, // can be removed since `true` is the default
  extends: vikeReact
} satisfies Config

[traviscooper]

Seems like I went half way between build it yourself and vike-react and got into a bad state. I'll start fresh with one of the base vike-react examples, and pull from there.

Appreciate the help!

[brillout]

Improved DX pre-released as 0.4.167-commit-c08a6bb.