Multiple submodule & lerna/yarn workspace packages of nextjs app as injected renderer

[softmarshmallow]

I'm planning of enterprise level application, which each web page gets deployed separately by subdomains on netxjs, but also providing a desktop app wrapped with electron, best fit for desktop experience.

In this situation, existing projects is built with nextjs + mono repo approach, i'de like to import those as submodules and build a desktop app as it. Any sugestions or ideas of how to structure this new project?

[saltyshiomix]

Hi @softmarshmallow , thank you for your question.

Do you already use next-transpile-modules?

Maybe it can help you much.

See this blog for monorepo nextjs usage :)

[b3nab]

I'm developing a Nextron app and a companion mobile app, I used the lerna/yarn workspaces approach. You can see a code example here: https://github.com/b3nab/mydeck

Just one thing: the first tries show my app with an "Internal server error", I only solved using the "nohoist" property on package.json to overcome this problem.

[softmarshmallow]

@b3nab Thanks! will take a deep look.

[b3nab]

Maybe if someone knows how to use lerna and yarn workspaces without using the nohoist property could be useful.

[softmarshmallow]

What if when I want to use next.js for vercel hosting (general web app) and share most of the code for desktop app? I cannot build uppon or need to build uppon nextron right? (I know for these kind case, there are no correct answers.)

What I have in mind is naively to build two different apps with shared codes. but there cannot be unified app that can support both web and desktop app using native features.

Wish someone can share thoughts with me!

[UdaraJay]

From what I understand, you have two options:

1/ If you want to stick to one codebase, use environment variables to switch between native and web features. The simpler end for an electron and next/react app would be to use some shared context to do this. Then use electron/nextron as a wrapper to host it, just pass in the right env variables.

2/ Two apps: Maintain a separate branch of the code for the native app where you implement the native features; use git to sync the main branch (web) --> app (native). You'd still want to plan your codebase out in a way where the native features are components specific, if you approach it carelessly the codebases can easily get messy and diverge over time.

[victorcarvalhosp]

I'm trying to use it with nrwl/nx - But I'm facing this error:

node:internal/modules/cjs/loader:959
  throw err;
  ^
Error: Cannot find module '/Users/victor/Documents/dev/monorepository-name/apps/nextjs-sample/package.json'
Require stack:
- /Users/victor/Documents/dev/streamlinehq/monorepository-name/node_modules/nextron/bin/nextron-dev.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:956:15)
    at Module._load (node:internal/modules/cjs/loader:804:27)
    at Module.require (node:internal/modules/cjs/loader:1022:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/victor/Documents/dev/monorepository-name/node_modules/nextron/bin/nextron-dev.js:2:179)
    at Module._compile (node:internal/modules/cjs/loader:1120:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1174:10)
    at Module.load (node:internal/modules/cjs/loader:998:32)
    at Module._load (node:internal/modules/cjs/loader:839:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/Users/victor/Documents/dev/monorepository-name/node_modules/nextron/bin/nextron-dev.js'
  ]
}
Node.js v18.7.0
Warning: run-commands command "cd apps/nextjs-sample && nextron" exited with non-zero status code

Problem is that I really don't have a project.json on this folder, as on nx they use the project.json approach for each project. Someone knows if there some workaround for this?