MicrosoftDocs / azure-docs

Open source documentation of Microsoft Azure
https://docs.microsoft.com/azure
Creative Commons Attribution 4.0 International
10.14k stars 21.23k forks source link

Not working when Next.js app is not at the root of the repo (npm workspaces) #105342

Closed bertrand-riviere closed 1 year ago

bertrand-riviere commented 1 year ago

Hello, Everything seems to work until I try to use a repo where my Next.js app is not at the root (npm workspaces). I have used app_location to specify the subfolder and the build step seems ok according to the logs:

---End of Oryx build logs--- Oryx has determined that the app build artifacts are in the '.next' directory. If this is incorrect please specify the app artifact location. Finished building app with Oryx Detected standalone folder, so using it for deployment. Repackaged Next.js app to deploy on the backend function. Skipping step to build /bin/staticsites/58fc9b11-d714-4fbf-9518-3810d1a59b20-swa-oryx/app/.next/standalone with Oryx Function Runtime Information. OS: linux, Functions Runtime: ~4, node version: 16 Zipping Api Artifacts Done Zipping Api Artifacts Zipping App Artifacts Done Zipping App Artifacts Uploading build artifacts. Finished Upload. Polling on deployment. Status: InProgress. Time: 1.0715993(s) Status: InProgress. Time: 16.2513246(s) Status: Succeeded. Time: 31.4279009(s) Deployment Complete :)

But then all pages / api endpoints return an error: Server Error. There was an unexpected error in the request processing.

By running a dir cmd after the build I noticed that the node_modules is not present in the app folder so I have even tried to copy it from the root cp ../node_modules ./node_modules -r but this does not help :(

Could you please advise on how this could be fixed?


Document Details

Do not edit this section. It is required for learn.microsoft.com ➟ GitHub issue linking.

Naveenommi-MSFT commented 1 year ago

@bertrand-riviere Thanks for your feedback! We will investigate and update as appropriate.

AjayKumar-MSFT commented 1 year ago

Apologies for the delay from over the weekend! I was unable to repro this issue. Are you still seeing this error?

Just to highlight, about the config folder for deployment:

_applocation - The root location of the source code to be deployed. This setting is typically / or the location of the JavaScript and HTML for your project.

_outputlocation - Name of the folder created by any build process from a bundler such as webpack. This folder both needs to be created by the build process, and a subdirectory under the app_location

_apilocation - The root location of your Azure Functions application hosted by Azure Static Web Apps. This points to the root folder of all Azure Functions for your project, typically api.

You may always Azure Monitor (if enabled) to fetch more info on the runtime error, see Monitor Azure Static Web Apps

Retrieve deployment error messages

bertrand-riviere commented 1 year ago

Hello,

Thanks for having a look to this issue but yes I still "see the error" :( I understand that my initial message was maybe not clear enough to reproduce so I have created 2 public git repos that you can use to reproduce (this is of course dummy code but that simulate quite well what I want to achieve). Just to be super clear; when running npm run build followed by npm run start locally both apps works exactly the same.


Simple npm app => The app works when deployed as an Azure "Static Web App" https://github.com/bertrand-riviere/next-azure-static-scr-root

Test urls:


Monorepo (npm workspaces) npm app => the app does NOT work when deployed as an Azure "Static Web App" https://github.com/bertrand-riviere/next-azure-static-scr-subfolder

The app_location is configured to '/subfolder': https://github.com/bertrand-riviere/next-azure-static-scr-subfolder/blob/2228e62b04fbc9e1861b2940a04056f20b68f93d/.github/workflows/azure-static-web-apps-nice-pebble-0a31a2003.yml#L30 and the build is successful but the app dos not work. Unfortunately when in this case (where it would be very useful) it is not even possible to enable "Application Insight". I assume the problem is somehow related to folder structure after the build (node_modules at the root and code, .next folder in a subfolder...) so I have tried various workarounds like copying it in the build script (next build && cp ../node_modules ./node_modules -r) but it does not help and since there is no log I am kind of blind.

Test urls:

bertrand-riviere commented 1 year ago

Hello @AjayKumar-MSFT, @Naveenommi-MSFT, Have you been able to investigate on this issue?

AjayKumar-MSFT commented 1 year ago

Apologies for the delay! To investigate this issue, we would need additional information about your subscription and WebApp details, for this, we need to connect offline. If you have a support plan, please raise a support ticket for a specialized assistance. Else, kindly let me know. -This channel is reserved for ‘Azure docs’ feedback- for sharing doc feedback and suggesting content improvements.