Skip to content
Prefix next links and images. Useful when serving from basePath.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci
src
test
.gitignore
README.md
package.json
yarn.lock

README.md

next-prefixed

Prefix next links and images. Useful when serving from basePath.

Codecov code style: prettier CircleCI npm npm

Read More

Installation

yarn add next-prefixed

Usage

next-prefixed exports components for rendering prefixed links and images. It also exports a function to prefix any url.

To set the prefix for the URLs, set the assetPrefix in your next.config.js.

const debug = process.env.NODE_ENV !== 'production';
const assetPrefix = debug ? '' : '/your_prefix/';

module.exports = withPlugins([withCSS, withMDX, withBlog], {
  assetPrefix,
  publicRuntimeConfig: {
    assetPrefix
  }
});

prefixURL

import { prefixURL } from 'next-prefixed';

prefixURL('/blog'); // => my_prefix/blog

Image

Passes all props to HTML img tag.

import { Image } from 'next-prefixed';

const Example = () => <Image src="pony.png" alt="Valiant Horse" />;

Link

Passes all props to next.js Link component.

import { Link } from 'next-prefixed';

const Example = () => <Link to="/blog" />;
You can’t perform that action at this time.