Improving Svelte with Google Apps Script

Last year I wrote about how I had been experimenting with building single-page apps (SPAs) using Svelte on top of Google Apps Script (GAS). The benefit of running the SPA inside the Google Apps Script environment is that you can leverage Google Apps Script as your backend, meaning you can pull data from Google Docs, Calendar, etc. It also makes it very easy to deploy your web app to all your Google Workspace users.

I was excited about the potential for building SPAs using Google Apps Script, but there were some rough edges, most notably the developer experience. I spent some more time polishing and have made the following improvements:

1. Instead of checking for a random window flag to determine if the UI is running locally or inside GAS, the code now takes advantage of the OOTB Vite environment variable via import.meta.env.DEV
2. Instead of having to check the environment before calling a google.script.run function, the DEV environment now mocks the google.script.run function, meaning that your UI code doesn’t have to worry about what environment it’s in
3. You can now mock the results of server functions in the src/lib/mocks.ts file, allowing you to build locally and simulate what the GAS functions will return.

Overall, this means that you can now write simpler Svelte code and have all the benefits of running and testing locally.

I have upgraded my svelte-google-apps-script repo with all these changes, so give it a try!

I have also been working on a side project that leverages all of this technology to address a small but interesting problem for me. More to come on that soon!