Error #3: No access to ViewModelStore

This happened because the viewModels param is not provided when creating a ViewModelBase instance.

Explanation:

This can happen if you override or implement the create() method in your custom ViewModelStore or ViewModelStoreBase and forget to pass the viewModels param to the ViewModel creation params.

import {
  ViewModelStoreBase,
  ViewModel,
  ViewModelCreateConfig
} from 'mobx-view-model';

export class ViewModelStoreImpl extends ViewModelStoreBase {
  constructor(protected rootStore: RootStore) {
    super();
  }

  create<VM extends ViewModel>(
    config: ViewModelCreateConfig<VM>,
  ): VM {
    const VM = config.VM;
    const yourCustomConfig = {
      ...config,
      viewModels: undefined,
    }
    return new VM(yourCustomConfig);
  }
}

The config argument in the create method should already have a viewModels property

Because it gets passed from <ViewModelsProvider />
Otherwise it will be undefined

Potential solution

1. Add ViewModelsProvider

Use <ViewModelsProvider /> to pass viewModels for all created VM instances in React.

Example:

export const App = () => {
  return <ViewModelsProvider value={vmStore}>...</ViewModelsProvider>;
};

2. Check your custom create() implementation

Check that you pass the viewModels param to the ViewModel creation params.

🤖 Prompt for LLM agents

Use the following prompt when asking an LLM agent to fix this error:

Fix Error #3 in the current repository: "No access to ViewModelStore".

Before editing anything, inspect the current repository and confirm that the
error is actually present. Work only inside the current repository; never edit
absolute paths or files in another project. If no affected usage is found,
report that fact and do not create unrelated files.

First check whether the user provided a stack trace, error log, or reproduction
steps. If the trace is missing and the failing creation path cannot be
identified from the repository, ask the user to provide the full stack trace
and the smallest reproduction before editing. If the repository clearly
contains the failing usage, continue without blocking on an additional trace.

Trace the failing ViewModel creation and inspect the relevant
`ViewModelsProvider`, `ViewModelStore`, or custom `ViewModelStoreBase.create()`
implementation. Ensure that the `viewModels` value supplied in the creation
config is preserved and passed to the new ViewModel. In a custom `create()`
method, start from the provided `config` and do not overwrite `viewModels` with
`undefined` or omit it. If the provider/store is genuinely missing, connect the
existing store using the repository's established pattern.

Do not stop after explaining the root cause. If an affected usage is confirmed,
edit the relevant source code and apply the smallest correct fix. Do not create
a new store, bypass the ViewModelStore, change ViewModel constructors, or hide
the error with a fallback. Inspect the diff and confirm that the creation path
preserves access to the intended ViewModelStore. If no safe code change can be
made, state the specific blocker instead of claiming that the error is fixed.
Preserve existing lifecycle behavior and TypeScript types. Add or update a
focused test only if the confirmed occurrence is covered by the
repository's existing test structure; do not create a new test file merely
because this prompt asks for one. Run the relevant typecheck, lint, and test
commands and report the files changed, root cause, and verification results.
The task is complete only after the confirmed occurrence has been fixed in the
repository (or the concrete blocker has been reported) and the relevant checks
have been run.