AdminUiPlugin

AdminUiPlugin

@vendure/admin-ui-pluginplugin.ts

Deprecated

From Vendure v3.5.0, the Angular-based Admin UI has been replaced by the new React Admin Dashboard. The Angular Admin UI will not be maintained after July 2026. Until then, we will continue patching critical bugs and security issues. Community contributions will always be merged and released.

This plugin starts a static server for the Admin UI app, and proxies it via the /admin/ path of the main Vendure server.

The Admin UI allows you to administer all aspects of your store, from inventory management to order tracking. It is the tool used by store administrators on a day-to-day basis for the management of the store.

Installation

yarn add @vendure/admin-ui-plugin

or

npm install @vendure/admin-ui-plugin

Example

import { AdminUiPlugin } from '@vendure/admin-ui-plugin';

const config: VendureConfig = {
  // Add an instance of the plugin to the plugins array
  plugins: [
    AdminUiPlugin.init({ port: 3002 }),
  ],
};

Metrics

This plugin also defines a metricSummary query which is used by the Admin UI to display the order metrics on the dashboard.

If you are building a stand-alone version of the Admin UI app, and therefore don't need this plugin to server the Admin UI, you can still use the metricSummary query by adding the AdminUiPlugin to the plugins array, but without calling the init() method:

Example

import { AdminUiPlugin } from '@vendure/admin-ui-plugin';

const config: VendureConfig = {
  plugins: [
    AdminUiPlugin, // <-- no call to .init()
  ],
  // ...
};

Signature

class AdminUiPlugin implements NestModule {
    constructor(configService: ConfigService, processContext: ProcessContext)
    init(options: AdminUiPluginOptions) => Type<AdminUiPlugin>;
    configure(consumer: MiddlewareConsumer) => ;
}

• Implements: NestModule

constructor

method

(configService: ConfigService, processContext: ProcessContext) => AdminUiPlugin

init

method

(options: AdminUiPluginOptions) => Type<AdminUiPlugin>

Set the plugin options

configure

method

(consumer: MiddlewareConsumer) =>