We are in a tight spot and it is a bit urgent and we have been trying for a week with no success. I am sure there is an easy solution but we are blind to see it, it seems
This is the situation:
We have a single repo with multiple folders within it. One folder is /main and the other folder /blog.
/main is a react application with its own netlify.toml and package.json file
/blog is a nextjs application with its own netlify.toml and package.json file
We also have netlify.toml file in the root folder.
At any point, we are able to build either the /main react application or the /blog nextjs application. We would love to build and have a site that has both working together.
For example, right now: only www.example.com (/main react app) works or www.example.com/blog (/blog nextjs app) works. We would love to have both working together.
We have already tried many different command prompts and have also tried redirects. proxies 200 rewrite and 301 redirect don’t work because of the css and styling issues that we face when using proxies.
Is there a way to simply write a build command or structure the toml file in a way to make both the npm builds work together?
@nishant As you’re dealing with two different site frameworks and they may not play nice together having one built at
/ and the other built at
/blog, the easiest way to solve may be to configure them as two separate sites in Netlify, and then use a proxy rule on the primary one to redirect from
/blog (and all sub-urls) through to the secondary site.
As shown here:
Thanks @nathanmartin for your response. This is exactly what we did first. The rewrite 200 unfortunately didnt work well as our next.js site lost all of its css and styling.
We just created a hash script to run multiple builds and now we are having permission issues such as:
- build.command from netlify.toml
3:23:38 AM: ────────────────────────────────────────────────────────────────
3:23:38 AM: $ sh ./build-both.sh
3:23:39 AM: > firstname.lastname@example.org build
3:23:39 AM: > next build
3:23:39 AM: sh: 1: next: not found
3:23:39 AM: “build.command” failed
3:23:39 AM: ────────────────────────────────────────────────────────────────
3:23:39 AM: Error message
3:23:39 AM: Command failed with exit code 127: sh ./build-both.sh (Search results for '"non-zero exit code: 127"' - Netlify Support Forums)
3:23:39 AM: Error location
3:23:39 AM: In build.command from netlify.toml:
3:23:39 AM: sh ./build-both.sh
Our .sh file
cd ./blog && npm run build
cd ./main && npm run build`
Our netlify.toml file in the root folder is:
command = "sh ./build-both.sh"
publish = ".next"
That shouldn’t be the case, and I’d imagine that the issue was simply the paths with the next.js site.
Yes, I agree it should not have been the case but we checked all the paths and none of them were absolute. The images and the html were seen but the css, the button clicks and the styling were completely off. Do you have any folder in specific that could be possibly causing this issue? This is our file structure.
Not sure what else we could do to make this work
I don’t work with the systems you’re working with, so have no tips off the top of my head, and I can’t really assist with the complexities/intricacies of your project.
It’s easier when you’re working with systems outputting static content, but with the frameworks that frequently output generative serverless functions to handle SSR etc. it’s impossible for me to guess how they would interact with each other in the same deployment, or how they might fall over.
It’s also why keeping them entirely separate strikes me as the simplest way of getting it working.
You could try with absolute paths, or as a fallback try the entire Netlify app url for the assets (e.g. https://mynetlifyapp.netlify.app/styles.css).