Several teams have built Vue versions of OOUI widgets (and some new components) that could form the basis of new shared components. This task covers identifying projects in or adjacent to MediaWiki that use Vue.js, and documenting existing reusable Vue component implementations, in the hopes of unifying these implementations in the long run.
MediaWiki Vue projects
| Project | Links | Notes | Delivery | Loading |
|---|---|---|---|---|
| Wikit | Code, Storybook, feature example | WMDE UI library, contains storybooks for docs and Vue components | Compiled with vue-cli | |
| Wikibase termbox | Code, docs | WMDE project | Vue-cli, uses MW's Vue | When viewing an entity on Wikidata on mobile |
| Wikidata Bridge | Code, docs | WMDE project | Vue-cli, loaded through RL | Articles with embedded Wikidata info |
| Wikibase Tainted References | Code | WMDE project | Vue-cli, MW Vue | When viewing an entity on Wikidata |
| Wikibase Vue components | Code | WMDE project | Vue-cli | |
| New searchbar/ WVUI | Code, Phab ticket, Docs | Comprises the existing WVUI library | WVUI compiled with Webpack; Vector pulls in WVUI, uses full RL | Every page, on user interaction |
| MediaSearch | Code, docs, feature | This code formerly existed in WikibaseMediaInfo | Full RL | Special:MediaSearch |
| MachineVision | Code, docs, feature | Full RL | Special:SuggestedTags | |
| ContentTranslation | Code, docs, feature (enwiki) | Contains Storybook of components | Vue-cli, loaded through RL, ships its own copies of Vue, vue-router and Vuex | Special:ContentTranslation ; small RL-based component for post-edit |
| NearbyPages | Code, docs, feature (enwiki) | Full RL, uses WVUI | Special:Nearby | |
| GlobalWatchlist | Code, docs | Full RL, uses WVUI | Special:GlobalWatchlist | |
| Toolhub | Code, docs | In development | Vue-cli, not in MediaWiki | |
| WikiLambda | Code, docs, | In development | Full RL | When viewing/editing ZObjects |
MediaWiki Vue components
The following is a list of existing reusable Vue component within MediaWiki projects. This list could become outdated quickly as developers continue to add new components, but this is just an initial list. We'll open a task for each component eventually, and in those tasks we'll do a fresh review of existing libraries to ensure we're capturing all existing implementations. In those tasks, the different implementations will be reviewed and discussed (see T278509 for an example).