CLASP is a command-line application developer by Google to develop and manage the Google Apps Script project easily. You can always use the built-in Script Editor to write App Scripts, however, it becomes difficult to manage the project when it becomes larger. For example, if you have multiple server-side functions or HTML files, it's always better to use CLASP to develop, debug & test the App Script projects. I used clasp for my previous project and clasp helped me heavily to debug and test the project on my local machine.

Features:

• Easy to use if you know the basics of Git.
• Provides code formatting, debugging, and word completion in a normal IDE way.
• Develop locally.

How to install CLASP?

Make sure you have installed the Nodejs environment.

I will recommend using VS Code for editing code.

Also, enable Google Apps Script API permission from here, script.google.com/home/usersettings

Now, run the below command. npm is a package manager which already installed if you have Nodejs already.

npm install -g @google/clasp

After that,

$ clasp

Great. If you have any issue like command not found, check npm prefix path. I used npx clasp to run before when I had some issues with the project. npx execute the package from the local or remote package.

How to use clasp?

Connect your Google Account

$ clasp login

Now, log in using your Google account.

Pull the script from Google Sheet using Script id

If you need to create a separate project, use the below command to create the standalone script.

clasp create

In this tutorial, I am showing clasp clone from Google Sheet. You need the Script ID to get the script from Google Sheet.

Get Script ID

Open your Google Sheet, open Tools > Script Editor, this will open the Apps Script page. Then, click on the settings from the sidebar and copy Script ID.

Project Structure

After getting the project script ID, now you need to create a local project. I would suggest cloning the remote project to a separate folder like the below code which will help you to separate src files and Nodejs files.

Note that, all the .gs files now be converted into js files.

Clasp Clone

Now, clone the project using the command:

clasp clone "SCRIPT ID" --rootDir src/

This will pull the script as well as create an appscript.json.

Clasp Pull

Pull the project from the remote using the Script ID.

#Pull from remote
clasp pull  
#Pull from remote using version number
clasp pull  --versionNumber 2

Clasp Push

Push the project to the remote.

#Push to remote
clasp push

Install autocomplete

Go to https://github.com/google/clasp/blob/master/docs/typescript.md which talks about how to install Google Apps Script specific types on VS Code.

npm i -S @types/google-apps-script

Conclusion

I hope this tutorial helped you to set up a clasp-based project. It is always much efficient to use clasp based on the project rather than the inbuilt script editor.

Useful Resources

• Youtube Video - Step by step instructions

• Gas-client ( https://github.com/enuchi/gas-client )

  • A client-side utility class to call server-side Google Apps Script functions. You can use in local development.

• React-Google-Apps-Script

  • A Boilerplate React project to develop Google Workspace addons.