Deploying Wasp/Open-SaaS to Netlify
Hello, I am a bit of a noob in deployment, so bear with my questions š
I am following the Netlify deployment guide, but when I reach the
netlify build command I don't see anything being built.
You can see in the attached image my file structure (it is the default one in Open-Saas), and here is the content of my netlify.toml files:
app/.wasp/build/web-app/netlify.toml:
app/.wasp/build/web-app/.netlify/netlify.toml:
21 Replies
Hi @Ricardo Batista. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Based on the information provided, it seems like you're trying to deploy your Wasp app's frontend to Netlify. Here are the steps you should follow according to the Wasp deployment guide (https://wasp-lang.dev/docs/advanced/deployment/manually#netlify-client):
1. Make sure you have a Netlify account and Netlify CLI (https://docs.netlify.com/cli/get-started/) installed.
2. Log in to your Netlify account via the CLI. You can check if you're logged in with
netlify status, and if you're not, you can log in with netlify login.
3. Build your Wasp app. You can do this by following the instructions in the Wasp deployment guide (https://wasp-lang.dev/docs/advanced/deployment/manually#1-generating-deployable-code).
4. Navigate to the .wasp/build/web-app directory with the command cd .wasp/build/web-app.
5. Run the command npm install && REACT_APP_API_URL=<url_to_wasp_backend> npm run build, where <url_to_wasp_backend> is the URL of the Wasp server that you previously deployed.
6. Deploy the client with the command netlify deploy.
7. Follow the instructions provided by the CLI. You'll need to decide whether you want to create a new app or use an existing one, and which team your app will reside under.
8. Finally, run the command netlify deploy --prod.
Your client should now be live at <https://<app-name>.netlify.app.>
Please note that you should set this URL as the WASP_WEB_CLIENT_URL environment variable in your server hosting environment (e.g., Fly.io or Heroku).
Regarding the issue you're facing with the netlify build command, it's worth noting that the Wasp deployment guide doesn't mention this command. Instead, it suggests using netlify deploy and netlify deploy --prod. If you're still facing issues, I recommend reaching out to the Wasp community on their Discord server (https://discord.com/channels/686873244791210014/1215566973191069696) for further assistance.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @Ricardo Batista, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?I had already changed this line in app/.wasp/build/web-app/netlify.toml:
to
because the app/build folder didn't exist.
And now I am a bit lost. The
netlify build command works fine:
But when I ran the netlify deploy command, I get no errors but the Website Draft URL gives me a 404.
Wohooo @Ricardo Batista, you just became a Waspeteer level 1!
When I look at the build folder, it seems to be fairly empty
Note: I am not deploying the backend
Hey @Ricardo Batista
I think you're running the wrong command.
After running
wasp build , then run cd .wasp/build/web-app and after that run
then from there you can run netlify deploy and finally neflify deploy --prod if everything looks good
you also should NOT have to change anything in the netlify.toml fileThanks @Vinny (@Wasp) , but in the case I am not configuring a backend, it should be
npm install && npm run build, right?yep.
but just to make sure, you have no
operations in your wasp app at all?No.
Open SaaS comes with many server operations built-in. In this case I guess you're just deploying the landing page
then it should work without the API URL
@Ricardo Batista if you want to make sure the code you're going to deploy is in a proper state, you can also run
wasp clean before you run wasp build. this will reset any config files that you may have changed unknowingly in your previous attempts to deployThanks @Vinny (@Wasp), just did
wasp clean > wasp build > cd .wasp/build/web-app >
npm install && npm run build > netlify deploy
And got this:
ok give me a minute to check something out
your Deploy path seems to be incorrect. It is pointing to
app/build instead of app/.wasp/build/web-app/build.
can you share the contents of your netlify.toml file @Ricardo Batista ?
also. can you right click the toml file and copy path and share it here
also when you ran npm install && npm run build what was output to the console?
ok I just tried it out on a new app and ran into the same error you haveIt works now!
Basically the netlify.toml file had:
Instead of
it looks like something changed with the new CLI from netlify
Exactly, might need to be changed in your production files