Next Base Path

Current Behavior

When I use the base path config and run nx serve myApp I can load my app on the specified base path, but when I run nx build myApp --prod & then run the app, the base path is ignored.

Expected Behavior

Should be able to render my app from both dev & production builds on the base path URL

Steps to Reproduce

1. npx create-nx-workspace@latest
2. cd my-org/apps/todos
3. Edit next.config.js to be module.exports = { basePath: '/something' };
4. nx serve todos You’ll find the todos app on localhost:4200/something 👍
5. nx build todos --prod && cp package.json dist/apps/todos && yarn && npx next start The todos app renders on localhost:3000 not localhost:3000/something 😢

Environment

  nx : Not Found
  @nrwl/angular : Not Found
  @nrwl/cli : 10.2.1
  @nrwl/cypress : 10.2.1
  @nrwl/eslint-plugin-nx : 10.2.1
  @nrwl/express : Not Found
  @nrwl/jest : 10.2.1
  @nrwl/linter : 10.2.1
  @nrwl/nest : Not Found
  @nrwl/next : 10.2.1
  @nrwl/node : Not Found
  @nrwl/react : 10.2.1
  @nrwl/schematics : Not Found
  @nrwl/tao : 10.2.1
  @nrwl/web : 10.2.1
  @nrwl/workspace : 10.2.1
  typescript : 3.9.7

[mandarini]

Hi there @hloughrey ! Thanks for filing an issue!

I think that this is not a bug of Nx, but rather the way Next.js and the basepath in next.config.js works, since the Next.js server uses it.

In order to solve your issue and be able to serve your production app using the next server from the correct basePath from within the build dist directory of your app, you should copy your next.config.js in the dist/apps/todos directory, next to the package.json.

Please let me know if this solves your issue, and if you would like any other help!

[hloughrey]

Hi @mandarini

Ah, that’s brilliant. I had tried running a Next production build in a non NX project and it worked, but come to think of it, that’s probably because next.config.js was at the root as you’ve pointed out. That’s a great help…thank you.