PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Friday, November 25, 2022

[FIXED] How to reuse a single JavaScript in both server and client components of G Suite Add-on?

 November 25, 2022     google-apps-script, google-apps-script-addon, javascript, maintainability, module     No comments   

Issue

I have a JavaScript file that's a generated parser (let's call it MyParser), which I am using in an add-on for Google Forms.

It needs to be used in the client side's Sidebar.html where I'm including it with HtmlService.createHtmlOutputFromFile('MyParser.js').getContent();, which means it must be an .html file as far as I understand. Then it must be used on the server side where I have it in a file MyParser.js.gs.

With my current solution, it's duplicated in my file structure:

Code.gs
MyParser.js.gs
MyParser.js.html
Sidebar.html

Is there a way I can make this work without having two files? Edit: As I understand it, libraries are only for the server side.

If not, any hints to making the updating of the two files more robust (currently it's manual copy/paste)?

Edit: According to the best practices, one must wrap the JavaScript inside a <script> tag inside the .html file:

Notice that the included files contain <style> and <script> tags because they're HTML snippets and not pure .css or .js files.

So it seems it's not easy to have just one file.


Solution

As far as I could tell, there's no way to reuse a single file and respect Google's best practices.

My solution, following @tehhowch's advice, was with @google/clasp and doing local development.

To build the parser (in another GitHub project), I use npm-run-script. So, I just appended a && bash makeHTML.sh to the build script.

Inside makeHTML.sh I wrapped the built MyParser.js file in a <script> tag with:

#!/usr/bin/env bash
{ echo "<script>"; cat MyParser.js; echo "</script>"; } > MyParser.js.html

Since I'm using bash it's not a true node.js solution (won't run unless there's bash installed). If someone knows of a better way to pull off the wrapping that's 100% node and doesn't require installing a whole bunch of other modules, feel free to edit the answer.



Answered By - Fuhrmanator
Answer Checked By - Marilyn (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

1,205,255

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © 2025 PHPFixing