What is Vue's plugin system?

Vue plugins are objects (or functions) that add global-level functionality to an application. They receive the app instance and options, allowing them to modify the app globally. Plugin structure: // myPlugin.js export const MyPlugin = { install(app, options) { // Add global component app.component("MyButton", MyButton); // Add global directive app.directive("tooltip", tooltipDirective); // Add global property app.config.globalProperties.$myMethod = (text) => doSomething(text); // Provide global data (inject anywhere) app.provide("myService", new MyService(options)); // Inject mixin (use sparingly) app.mixin({ mounted() { /* ... */ } }); console.log("Plugin installed with options:", options); } };. Installing a plugin: app.use(MyPlugin, { apiKey: "abc123", timeout: 5000 }). Function plugin: if the plugin is just a function with an install method: app.use((app, options) => { app.component("Icon", Icon); }). Idempotency: app.use() prevents the same plugin from being installed twice. Well-known plugins: Vue Router (provides useRouter, useRoute via provide/inject), Pinia (provides usePinia), Vue i18n, Vue Test Utils. Creating testable plugins: use provide/inject for services instead of globalProperties — easier to mock in tests. Plugin typing (TypeScript): augment module declarations for globalProperties: declare module "vue" { interface ComponentCustomProperties { $myMethod: (text: string) => void; } }. Plugin best practices: avoid modifying Vue itself (Vue.prototype patterns); use app-scoped changes; document the provide keys.