Enabling VINEJS schema validation
@vinejs/vine is a schema validation library with synchronous rules and an async validation API.
@vinejs/vine is not included in the package, so you have to install it manually.
npm install --save @vinejs/vineDefine the VineJS schema
import { Vine } from '@vinejs/vine';
const vine = new Vine();
const $schema = vine.object({
email: vine.string().email(),
age: vine.number().min(18),
user: vine.object({
zip: vine.string().minLength(5),
}),
});Define a plugins object
VINEJS requires the package prop (a Vine instance) together with the previously defined schema. The schema is compiled by the driver.
import vinejs from 'mobx-formkit/lib/validators/VINEJS';
const plugins = {
vinejs: vinejs({
package: vine, // Vine instance
schema: $schema,
})
};Create the form passing the plugins object
new Form({ ... }, { plugins });Async (promise-based) validation
VineJS validate() is async-by-design at the API level — even for synchronous rules. The driver consumes the mobx-formkit async contract (setValidationAsyncData + promises), so always await validation:
await form.validate();
await form.submit();Errors are matched per-path from VineJS error.messages (dot-notation paths like user.zip), so nested field errors land on the correct field automatically.
Note: VINEJS supports the
extendcallback ({ validator, form }). For custom rules use VineJS.rule()/.refine()on the schema directly.