Skip to content

馃檹 Help wanted: Support new frontend system#2458

Description

@christoph-jerolimov

TL;DR: We would like to encourage plugin authors and the community to add support for the new frontend system to plugins.

A list of plugins and their status could be seen here:

https://github.com/backstage/community-plugins/blob/main/docs/compatibility/new-frontend-system.md

Existing frontend plugins

Here are some plugins that supports the new frontend system, links goes to the alpha entry point to learn from them:

Work in process

Please let us know if you have time to add the new frontend system to a plugin so we can share the effort.

Check the comments below; but I try to summarize it here.

How do I help?

Add alpha support to a frontend-plugin

  1. Add to the frontend plugin package.json:

      "exports": {
        ".": "./src/index.ts",
        "./alpha": "./src/alpha.tsx",
        "./package.json": "./package.json"
      },
      "typesVersions": {
        "*": {
          "alpha": [
            "src/alpha.tsx"
          ],
          "package.json": [
            "package.json"
          ]
        }
      },
  2. Add the alpha export based on your needs to src/alpha.tsx, for example (many plugins splits this import up into multiple files):

    import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
    
    /**
     * Backstage frontend plugin.
     *
     * @alpha
     */
    export default createFrontendPlugin({
      id: 'your-plugin-id',
      extensions: [
        // TODO
      ],
    });

    For more details, check out the migration guide for plugins

  3. If your plugin workspace has an packages/app you can add an packages/app-next to test your plugin within a backstage app.

Test new frontend system

See the testing plugins section in the new frontend system documentation.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions