0

Let's say I get content from a Wordpress post.

In several places, the article links to other internal articles.

These posts will link to api.example.com/article not example.com/article.

How does Next.js handle links that can't be hard-coded using <Link />?

R.F. Nelson
  • 1,828
  • 2
  • 8
  • 22
AO Folts
  • 379
  • 2
  • 11
  • Not sure about Next.js, but I ran into a [similar problem with React-Router](https://stackoverflow.com/a/44549752/65387). You might want to dig into the source-code and see how they did it... you can probably pull something out if there's no public API. – mpen Jul 24 '18 at 00:11

1 Answers1

0

You can do this with custom routing and JavaScript replace. First setup the custom routing as I described here: Next.js - route based modal

Once this is setup create a route for the articles. Lets say for example you replace the link with api.example.com/articles/:id:

const nextRoutes = require('next-routes');
const routes = (module.exports = nextRoutes());

routes
    .add('article', '/articles/:id', 'article')

Once these routes are setup your links should work. The one disadvantage of this approach is using standard links will force a reload on each page, since Next only supports browser rendering using its link module.

ForrestLyman
  • 1,194
  • 12
  • 21
  • Yea, I figured it would involve replace. Really sucks that those links force a full reload. Kinda defeats the whole purpose of Next.js. – AO Folts Jul 23 '18 at 23:59
  • Yeah, I really like Next, but there is a lot of pretty standard web app functionality (parameterized routing for example) that requires custom configuration. On the other hand its a super active project and getting better every day. If you find a better solution please update this thread, I'm curious too. – ForrestLyman Jul 24 '18 at 00:08