export const metadata = { title: Admin Widget / UI Route Not Showing, }

{metadata.title}

This troubleshooting guide covers common reasons why an admin widget or UI route may not be showing in your Medusa Admin and how to resolve them.

Incorrect Zone

If you're adding an admin widget, make sure you're using a correct zone.

Refer to the Admin Widget Injection Zones list for reference.

Incorrect Function Definition

Widget and UI routes must be defined as arrow functions. Any other type of declaration isn't accepted.

Refer to the Admin Development Constraints documentation for more details.

Incorrect Type of Zone Value

A widget zone's value must be wrapped in double or single quotes:

export const config = defineWidgetConfig({
  zone: "product.details.before",
})

Any other usage leads to the widget not being shown.

Refer to the Admin Development Constraints documentation for more details.

Errors in Docker

If you're using a Docker image to host your Medusa application, make sure that the image's root path is different than the Medusa Admin's path configuration.

For example, if your Docker image's root path is /app, make sure to change the path configuration in medusa-config.ts, as it's /app by default:

module.exports = defineConfig({
  admin: {
    path: `/dashboard`,
  },
  // ...
})

Uncaught SyntaxError: The request module does not provide an export named default

If you're using a third-party library that isn't ESM compatible, you might encounter this error in the console when you access the admin.

To resolve it, add the third-party library to vite's optimizeDeps configuration in medusa-config.ts. For example:

module.exports = defineConfig({
  admin: {
    vite: () => {
      return {
        optimizeDeps: {
          include: ["qs"],
        },
      }
    },
  },
  // ...
})

Where qs would be the third-party library you're using.

Learn more about the optimizeDeps configuration in the Vite documentation. Also, learn more about Medusa's admin configurations in this documentation.