Custom Aliases

If you use custom aliases, you may need to help Preview.js resolve imports.

Since Preview.js uses Vite under the hood, you just need to configure Vite with resolve.alias.

For example if you use statements such as import ... from "ui-components/Button" that should map to src/ui/components/Button, you will need the following configuration:

// vite.config.js

export default {
  resolve: {
    alias: {
      "ui-components": "src/ui/components",
    },
  },
};

js/tsconfig.json support

Preview.js can automatically detect aliases from tsconfig.json (as well as jsconfig.json). As a result, you may not need to explicitly provide aliases.