```ts
import Foo from "./Foo"
import Services from "./services";

export default config<Services>()
    .service("foo", it => it
        .lifetime("container")
        .wants(
            { $ref: "bar", lazy: true, default: undefined },
            "baz"
        )
        .factory((bar,baz) => new Foo(bar,baz))
    )
    .service("loginForm", it => it
        .wants("authService")
        .factory(authService => LoginForm({authService}))
    )
    .service("view", it => it
        .wants(
            { $ref: "loginForm", lazy: true },
            { $ref: "mainForm", lazy: true, context: "new" },
            "authService"
        )
        .factory((login, main, authService) => View({login, main, authService}))
    )
    .value("host", "localhost")
    .done();
    
const View = ({login, main, authService}) => {
    useModel(() => new ViewModel(authService));

    return <Router>
        <Route path="login" component={login}/>
        <Route default component={main}/>
    </Router>;
}
```