search

enuchi / React-Google-Apps-Script

This is your boilerplate project for developing React apps inside Google Sheets, Docs, Forms and Slides projects. It's perfect for personal projects and for publishing complex add-ons in the Google Workspace Marketplace.
MIT License
1.32k stars 171 forks source link

Support for NextJs #214

Closed mouricef closed 4 months ago

mouricef commented 5 months ago

Hey there, great project, I'm a little confused on how this would work with NextJS? I tried to modify the the next.config.js based on webpack config but it seems like most of the plugins would not work. Can you please help here to get this working with nextjs

enuchi commented 5 months ago

Yes, certain plugins are needed to bundle the project in a way that is compatible with Google Apps Scripts.

I'm working on an update that uses vite instead of webpack, for more modern tooling. Should be ready in a couple weeks.

Next.js is probably not a great solution since it requires a node runtime for server-side rendering and google apps scripts isn't set up that way.

mouricef commented 5 months ago

@enuchi Thanks for the clarification! I totally understand your point about the server-side rendering aspect of Next.js not aligning with Google Apps Script.

However, I'm not planning to utilize any server-side rendering features of Next.js for this project. My intention is to leverage Next.js, as I already have some reusable components built using it. I believe with proper configuration and adjustments, it should be possible to make it compatible with Google Apps Script.

Considering this, do you have any specific suggestions or guidelines on how I could modify the project to achieve this compatibility? Any insights or advice would be greatly appreciated! Looking forward to your thoughts on this.

enuchi commented 5 months ago

Sure. You can't reference different files from an HTML page in Google Apps Script dialogs, so I would focus on getting Next.js to build your bundle and inline all scripts into a single HTML file.

You also may want to reduce overall bundle size for performance reasons, so I've setup externalization of react, react dom and any large libraries, but I wouldn't prioritize this for now. Just focus on getting everything into one HTML file.

You could still use the existing webpack setup here for server-side scripts only.

mouricef commented 5 months ago

@enuchi Thank you so much for your guidance and for considering the integration of Next.js with Google Apps Script. Your suggestion to focus on bundling all scripts into a single HTML file aligns perfectly with what I need, and I'm eagerly awaiting your help in getting Next.js to build the bundle and inline all scripts into a single HTML file. I truly appreciate your effort in getting Next.js to achieve this.

Your advice on utilizing the existing webpack setup for server-side scripts is also incredibly helpful. I'll definitely explore this approach further.

I'm really glad to have your support on this, and I'm genuinely excited about the possibilities once we overcome this hurdle. At the moment, I'm feeling a bit stuck, but with your insights, I'm confident we'll make progress soon.

Once again, thank you for your guidance and assistance. Looking forward to your response.