Using next-routes with prefix

Hi I have an issue like below:

server.js

app.prepare().then(() => {
  const server = express();
  const router = express.Router();

  router.get('/:area', (req, res) => {
    return app.render(req, res, '/index', req.query);
  });

  router.get('*', (req, res) => handle(wrappedRequest(req), res));

  server.use('/prefix', router);
  server.use('/prefix/static', express.static('static'));

  server.listen(3000, err => {
    if (err)
      throw err;
    console.log(`> Ready on http://localhost:3000/prefix`);
  });
});

what I want to do is using next-routes? It worked fine when not using prefix.

Is there any way to integrate prefix to next-route?

[stanleyfok]

My solution is to modify the findAndGetUrls method. I am using the ENV var named basedPath. It works nicely

next.config.js

module.exports = {
  assetPrefix: envConfig.ASSET_PREFIX,

  publicRuntimeConfig: {
    basePath: envConfig.BASE_PATH,
  },
}

server.js

...
          const server = express();
          const router = express.Router();

          router.get('*', (req, res) => handle(req, res));

          server.use(envConfig.BASE_PATH, router);

          server.listen(envConfig.PORT, (err) => {
            if (err) throw err;

            console.log(`> Ready on http://localhost:${envConfig.PORT}`);
          });
...

routes.js

const escapeRegExp = require('lodash/escapeRegExp');
const config = require('next/config').default();

const routes = require('next-routes')();

const oldFindAndGetUrls = routes.findAndGetUrls.bind(routes);

routes.findAndGetUrls = (nameOrUrl, params) => {
  const { basePath } = config.publicRuntimeConfig;

  let mNameOrUrl = nameOrUrl;
  if (basePath && basePath !== '/') {
    const re = new RegExp(`^${escapeRegExp(basePath)}`);
    mNameOrUrl = nameOrUrl.replace(re, '');
  }

  const findAndGetUrls = oldFindAndGetUrls(mNameOrUrl, params);

  if (basePath && basePath !== '/') {
    findAndGetUrls.urls.as = `${basePath}${findAndGetUrls.urls.as}`;
  }

  return findAndGetUrls;
};

// usage: routes.add(name, pattern, page);
routes
  .add('index', '/', 'index')
  .add('login', '/login', 'login');

module.exports = routes;

[zvictor]

I wanted to have all my routes prefixed with assetPrefix, but I didn’t manage to export it from the config file in a clean way.

My solution was to replicate assetPrefix in the public settings and override Link with it:

next.config.js

const PREFIX = '/myAppPrefix'

module.exports = {
  assetPrefix: PREFIX,
  publicRuntimeConfig: {
    assetPrefix: PREFIX,
  },
}

routes.js

const { mapProps } = require('recompose')
const NextLink = require('next/link').default
const config = require('next/config').default()

const mapper = ({ as, href, ...props }) => {
  const { assetPrefix } = config.publicRuntimeConfig

  return {
    ...props,
    as: `${assetPrefix}${as}`,
    href: `${assetPrefix}${href}`,
  }
}

const Link = mapProps(mapper)(NextLink)
const routes = (module.exports = require('next-routes')({ Link }))

routes.add('home', '/', 'index')
...