Extension:SearchVue

SearchVue provides improvements to the Special:Search page including a new "quickview" panel. For the "TypeaheadSearch" bar at the top of each page, see either Codex or Skin:Vector.

Requirements
MediaWiki 1.36.0 or greater.

While not strictly required, we strongly suggest installing these dependencies to enhance the media search experience.

System-level dependencies

 * ElasticSearch (see here for more information on how to install)

MW Extensions
The following Mediawiki extensions are recommended:


 * CirrusSearch and dependencies, for improved search results.

We strongly recommend also installing these extensions to allow more metadata to be used to enhance search results:


 * PagesImages

If you have a Wikibase repository and a local image store, we strongly recommend also installing these extensions to allow more data to be used to enhance multimedia search results:


 * MediaSearch
 * WikibaseMediaInfo
 * WikibaseCirrusSearch

Installation
After the extensions listed above are set up properly, enable the extension by adding  along with the required config variables to.

You might need to run  in the extension directory, or in the root directory of your MediaWiki installation if you are using a setup that merges all extension's dependencies into MediaWiki's vendor directory.

Configuration
Extension configuration variables are sets of key-value pairs. They are documented in more detail in. Config variables should be added to.

JavaScript/Vue
As much as possible, we default to the Vue Style Guide.

For now, we are not using full single-file components because we need to be able to compile Less separately so it can be included immediately before the app loads to style the PHP UI.

CSS/Less
Since Wikimedia UI base variables aren't in core, we require them as a package dependency, then use a shell script to copy them to the  directory. To update the base variables, require the new version in package.json and install it, then run  to copy the updated file into. Commit the updated files.

We're including the base variables in our custom variables file,. To use them in other files, include  rather than directly including the base file itself.

The CSS class name prefix  should be used for extension-level components.