name | slug | description | framework | useCase | css | deployUrl | demoUrl | relatedTemplates | |
---|---|---|---|---|---|---|---|---|---|
Monorepo with Nx |
monorepo-nx |
Learn to implement a monorepo with a single Next.js site using Nx. |
Next.js |
Documentation |
CSS |
|
This is a monorepo example using Nx and a single Next.js site in ./apps/app.
https://solutions-nx-monorepo.vercel.sh
You can choose from one of the following two methods to use this repository:
Deploy the example using Vercel:
Execute create-next-app
with npm, Yarn, or pnpm to bootstrap the example:
npx create-next-app --example https://github.com/vercel/examples/tree/main/solutions/nx-monorepo nx-monorepo
yarn create next-app --example https://github.com/vercel/examples/tree/main/solutions/nx-monorepo nx-monorepo
pnpm create next-app --example https://github.com/vercel/examples/tree/main/solutions/nx-monorepo nx-monorepo
Run npx nx serve app
for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run npx nx build app
to build the project. The build artifacts will be stored in the dist/
directory. Use the --prod
flag for a production build.
Run npx nx test app
to execute the unit tests via Jest.
Run npx nx affected:test
to execute the unit tests affected by a change.
Run nx g @nrwl/react:component my-component --project=app
to generate a new component.
Run npx nx g @nrwl/react:app new-app
to generate an application.
You can use any of the plugins above to generate applications as well.
When using Nx, you can create multiple applications and libraries in the same workspace.
Run npx nx g @nrwl/react:lib my-lib
to generate a library.
You can also use any of the plugins above to generate libraries as well.
Libraries are shareable across libraries and applications. They can be imported from @with-nx/mylib
.
Visit the Nx Documentation to learn more.
This example is configured to work out of the box with Nx Cloud. However, if deploying an existing project to Vercel - ensure:
If using @nrwl/nx-cloud@14.6.0
or above
- Set
NX_CACHE_DIRECTORY=/tmp/nx-cache
If using @nrwl/nx-cloud@14.5.0
or below
- Set
NX_CACHE_DIRECTORY=/tmp/nx-cache
- Set the
cacheDirectory
option for the@nrwl/nx-cloud
runner in yournx.json
to match the value of theNX_CACHE_DIRECTORY
environment variable:
"runner": "@nrwl/nx-cloud",
"options": {
// this must be the same value as `NX_CACHE_DIRECTORY`
"cacheDirectory": "/tmp/nx-cache"
}
Visit Nx Cloud to learn more.