{"id":18918,"library":"vue-strict-prop","title":"vue-strict-prop","description":"A strict-typed prop builder for Vue 2 components, enabling compile-time type safety for component props using TypeScript. Version 0.3.6, last updated in 2019, and is no longer actively developed. Provides a chainable API to define required, optional, and default props with validators, supporting arrays of types, string literals, and custom types. Differentiates from Vue's native prop options by offering static type inference for component instances without relying on PropType or manual type annotations. Requires Vue 2.x and TypeScript ≥2.9.1.","status":"maintenance","version":"0.3.6","language":"javascript","source_language":"en","source_url":"https://github.com/wonderful-panda/vue-strict-prop","tags":["javascript","Vue","TypeScript","typescript"],"install":[{"cmd":"npm install vue-strict-prop","lang":"bash","label":"npm"},{"cmd":"yarn add vue-strict-prop","lang":"bash","label":"yarn"},{"cmd":"pnpm add vue-strict-prop","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency – requires Vue 2 runtime for prop instantiation","package":"vue","optional":false},{"reason":"peer dependency – required for type checking at build time","package":"typescript","optional":false}],"imports":[{"note":"ESM default import; CommonJS may not work as the package exports only ESM via module entry.","wrong":"const p = require(\"vue-strict-prop\")","symbol":"default","correct":"import p from \"vue-strict-prop\""},{"note":"PropBuilder is a type, so use `import type` in TypeScript to avoid runtime import.","wrong":"import { PropBuilder } from \"vue-strict-prop\"","symbol":"PropBuilder","correct":"import type { PropBuilder } from \"vue-strict-prop\""},{"note":"StringLiteralOptions is a type; use `import type` for correct usage.","wrong":"import { StringLiteralOptions } from \"vue-strict-prop\"","symbol":"StringLiteralOptions","correct":"import type { StringLiteralOptions } from \"vue-strict-prop\""}],"quickstart":{"code":"import Vue from \"vue\";\nimport p from \"vue-strict-prop\";\n\nconst MyComponent = Vue.extend({\n  props: {\n    title: p(String).validator(v => v.length >= 3).required,\n    count: p(Number).default(0),\n    items: p.ofArray<string>().required\n  },\n  template: '<div>{{ title }}: {{ count }} items</div>'\n});\n\nnew MyComponent({ propsData: { title: \"Hello\", items: [\"a\"] } }).$mount();","lang":"typescript","description":"Defines a Vue component with strict-typed props using vue-strict-prop, including required, default, and array props, then mounts it."},"warnings":[{"fix":"Migrate to Vue 3 with defineComponent and PropType, or use TypeScript's built-in prop inference with Vue.extend.","message":"Package is in maintenance mode; no updates since 2019. Not compatible with Vue 3. Consider using PropType or vue-class-component for type safety.","severity":"deprecated","affected_versions":">=0.0.0"},{"fix":"Always chain default before required/optional: p(T).default(val).required instead of p(T).required.default(val).","message":"The 'default' method on prop builders must be called before 'required' or 'optional' to retain type inference for the default value. Calling default after optional yields 'never' type.","severity":"breaking","affected_versions":"<=0.3.6"},{"fix":"Ensure passed values match intended literal strings: p.ofStringLiterals('black', 'blue', 'red').","message":"The `p.ofStringLiterals()` method accepts union of literal strings but the example shows a typo 'brack' instead of 'black'. This does not cause error but the string literal type will be incorrect.","severity":"gotcha","affected_versions":"<=0.3.6"},{"fix":"Use explicit type assertion: p.ofType<SomeType>() as Prop<SomeType> if needed, or define prop with default value to enforce validation.","message":"TypeScript strict mode may cause errors with `p.ofType<T>()` if T is not assignable to Vue's Prop type constraint. The builder assumes T is a plain type without validation.","severity":"breaking","affected_versions":"<=0.3.6"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Add nullish check: `if (this.prop) { ... }` or use `.required` if the prop is mandatory.","cause":"Prop defined as optional (`.optional`) but used without undefined check in template or component method.","error":"TS2322: Type 'string | undefined' is not assignable to type 'string'."},{"fix":"Ensure validator is called after specifying the type: p(String).validator(v => ...).required","cause":"Calling `.validator()` before passing type argument to p. The correct order is p(Type).validator(fn).","error":"Uncaught TypeError: p(...).validator is not a function"},{"fix":"Run npm install vue-strict-prop and ensure TypeScript's moduleResolution is set to 'node' and esModuleInterop is enabled.","cause":"Package is not installed or module resolution fails due to missing @types/vue or incorrect import path.","error":"Cannot find module 'vue-strict-prop'"},{"fix":"Remove the explicit type if default is provided: p(String).default('hello') instead of p(String).default<string>('hello').","cause":"Passing both a default value and a type to `.default(value)` where the type expects only one argument.","error":"TS2554: Expected 1 arguments, but got 2."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}