question

TimSchonborn-3020 avatar image
1 Vote"
TimSchonborn-3020 asked TimSchonborn-0886 commented

VSCode react deployment uses development build rather than production

When I deploy my react app to Azure App Service (using the VSCode extension), the output window shows:

...
Running 'yarn run build'...
yarn run v1.22.10
$ react-scripts build
Creating an optimized production build...
Compiled successfully.
...
However, when I visit the app, the react browser extension warns me that the App is using a development build. Does anyone know what's going on here? Am I doing something wrong?

I used CRA to create the app and didn't change any config files.

Thanks!

azure-webapps
· 3
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Thanks for asking question! Could you please share steps/ document you are following to deploy react app to Azure App Service, to help you better on this. Check this blog Deploy Create-React-App using Azure and VSCode or this step by step article might be helpful.

Disclaimer: This response contains a reference to a third-party World Wide Web site. Microsoft is providing this information as a convenience to you.




0 Votes 0 ·

Just checking if you have chance to see below response. If you are still facing this issue, looking forward to help you on this.

0 Votes 0 ·

Hi, I switched email addresses and somehow missed the notification for your answer, sorry!
I did follow the tutorial, but without any luck, the application still ends up in development mode (according to the official React Chrome extension). As commented below, I now use a GitHub Action to compile the code. I'd still be interested in getting vscode working though!

0 Votes 0 ·

1 Answer

Hi-3621 avatar image
0 Votes"
Hi-3621 answered TimSchonborn-0886 commented

Hello! I am also having this problem with React app deployed to Azure App Service through the VSCode extension. I am never asked what directory I want to publish FROM like in the tutorial linked above (I believe this tutorial uses a previous VSCode extension version), and it says it is building the production mode of react in the output during the deployment, but when I go in to actually look at it, its in development mode.

A react app site in development mode will look unprofessional and insecure to tech-savvy clients.

Thank you!

· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

I wasn't able to solve this, so instead of using the vscode extension, I switched to a GitHub Action workflow that builds and deploys the application. In the deployment center of the app service page, you can auto-generate the right workflow.yml file to automate this process. Hope this helps!

0 Votes 0 ·