diff --git a/plugins/shortcuts/README.md b/plugins/shortcuts/README.md index 162afe009b..a3da6bc4ee 100644 --- a/plugins/shortcuts/README.md +++ b/plugins/shortcuts/README.md @@ -4,20 +4,24 @@ The shortcuts plugin allows a user to have easy access to pages within a Backsta ## Usage -Install the package: +### Install the package: ```bash yarn add @backstage/plugin-shortcuts ``` -Add it to your App's `plugins.ts` file: +### Register plugin: + +This plugin requires explicit registration, so you will need to add it to your App's `plugins.ts` file: ```ts // ... export { shortcutsPlugin } from '@backstage/plugin-shortcuts'; ``` -Add the `` component within your ``: +If you don't have a `plugins.ts` file see: [troubleshooting](#troubleshooting) + +### Add the `` component within your ``: ```tsx import { Sidebar, SidebarDivider, SidebarSpace } from '@backstage/core'; @@ -50,3 +54,33 @@ export const apis = [ }), ]; ``` + +# Troubleshooting + +If you don't have a `plugins.ts` file, you can create it with the path `packages/app/src/plugins.ts` and then import it into your `App.tsx`: + +```diff ++ import * as plugins from './plugins'; + +const app = createApp({ + apis, ++ plugins: Object.values(plugins), + bindRoutes({ bind }) { + /* ... */ + }, +}); +``` + +Or simply edit `App.tsx` with: + +```diff ++ import { shortcutsPlugin } from '@backstage/plugin-shortcuts + +const app = createApp({ + apis, ++ plugins: [shortcutsPlugin], + bindRoutes({ bind }) { + /* ... */ + }, +}); +```