Google Apps Script Extension Pack
The Extension Pack for Google Apps Script is a collection of popular extensions that help you write, test and debug your Google Apps Script code inside Visual Studio Code. Check out the Google Apps Script for Developers guide to get started.
Recommended VS Code Settings
Here are the recommended settings for working with Google Apps Script in Visual Studio Code.
Editor Settings
The recommended monospace coding fonts are Ubuntu Mono. Red Hat Mono, Fira Code, JetBrains Mono and IBM Plex Mono.
"editor.fontSize": 15,
"editor.fontFamily": "Ubuntu Mono, Red Hat Mono, Fira Code, JetBrains Mono, IBM Plex Mono",
"editor.fontLigatures": true,
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": true,
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"[javascript]": {
"editor.formatOnSave": false,
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"files.autoSave": "onFocusChange",
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true,
"source.organizeImports": false,
"source.sortImports": true
},
"files.exclude": {
"**/node_modules": true
},
"search.exclude": {
"**/*-lock.json": true,
"**/node_modules": true,
"**/dist": true
},
Integrated Terminal Settings
The recommended terminal is iTerm2 and the font is Ubuntu Mono.
"terminal.external.osxExec": "iterm.app",
"terminal.integrated.fontSize": 14,
"terminal.integrated.lineHeight": 1.45,
"terminal.integrated.cursorBlinking": true,
"terminal.integrated.cursorStyle": "underline",
"terminal.integrated.defaultProfile.osx": "zsh",
"terminal.integrated.fontFamily": "'Ubuntu Mono',Monospace,'Cascadia Code'",
Terminal Color Theme (workbench.colorCustomizations)
"terminal.background": "#282936",
"terminal.foreground": "#E9E9F4",
"terminalCursor.background": "#E9E9F4",
"terminalCursor.foreground": "#E9E9F4",
"terminal.ansiBlack": "#282936",
"terminal.ansiBlue": "#62D6E8",
"terminal.ansiBrightBlack": "#626483",
"terminal.ansiBrightBlue": "#62D6E8",
"terminal.ansiBrightCyan": "#A1EFE4",
"terminal.ansiBrightGreen": "#EBFF87",
"terminal.ansiBrightMagenta": "#B45BCF",
"terminal.ansiBrightRed": "#EA51B2",
"terminal.ansiBrightWhite": "#F7F7FB",
"terminal.ansiBrightYellow": "#00F769",
"terminal.ansiCyan": "#A1EFE4",
"terminal.ansiGreen": "#EBFF87",
"terminal.ansiMagenta": "#B45BCF",
"terminal.ansiRed": "#EA51B2",
"terminal.ansiWhite": "#E9E9F4",
"terminal.ansiYellow": "#00F769"
Google Apps Script Resources
Extensions in Apps Script Pack
By installing the Google Apps Script extension pack, the following extensions are included in your Visual Studio Code workspace:
- Spell Right - A spell checker extension for source code and plain text files.
- Turbo Console Log - Easily add
console.log
messages to your code for easier debugging.
- Open Folder - Quickly open a new instance of Visual Studio Code with the selected folder.
- npm Intellisense - Easily import npm packages to your code.
- npm Scripts - Validate dependencies defined in the
package.json
file and easily run npm scripts from the command palette.
- Path Intellisense - Easily import filenames to your code.
- ESLint - Find and automatically fix common problems in your Google Apps Script code.
- Peacock - Useful when you work with multiple VS Code instances and want to quickly identify which is which.
- Dracula Theme - A recommended dark theme for Visual Studio Code that also supports Vim, Zsh, iTerm, Sublime Text, Emacs, and many other editors.
- Vim - A Vim-like editor for Visual Studio Code.
- Gitlens - Know who committed what to your code and easily revert changes.
- node_modules Search - Easily search files inside the
node_modules
folder that are normally excluded from default search results.
- Great Icons - A set of beautiful and sharp icons that are great for Google Apps Script project files and folders.
- Prettier - Prettier is a perfect code formatter for JavaScript, TypeScript, CSS, and HTML files.
- REST Client - A lightweight Postman-like REST client for running HTTP requests inside the code editor.
- Reload - Adds a reload button to the status bar for quickly reload the current instance of Visual Studio Code.
- Gremlins Tracker - Discover any invisible characters in your Google Apps Script code, like zero width spaces, that can cause problems later.
- Microsoft Edge Tools - Adds Chrome developer tools inside VS code and helps you fix CSS issues and inspect network activity.
- GitHub Repo - A GitHub repository browser inside VS code.
- DocumentThis - Automatically generates detailed JSDoc comments in TypeScript and JavaScript files for @custom functions.
- Dependency Cruiser - Visualize the dependency graph of any file in your Google Apps Script project.
- Unused Exports - Find unused exports in your Google Apps Script project.
Extension Statistics
Extension |
Version |
Downloads |
Rating |
Spell Right |
|
|
|
Turbo Console Log |
|
|
|
Open Folder |
|
|
|
npm Intellisense |
|
|
|
npm Scripts |
|
|
|
Path Intellisense |
|
|
|
ESLint |
|
|
|
Peacock |
|
|
|
Dracula Theme |
|
|
|
Vim |
|
|
|
Gitlens |
|
|
|
node_modules Search |
|
|
|
Great Icons |
|
|
|
Prettier |
|
|
|
REST Client |
|
|
|
Reload |
|
|
|
Gremlins Tracker |
|
|
|
Microsoft Edge Tools |
|
|
|
GitHub Repo |
|
|
|
DocumentThis |
|
|
|
Dependencies Cruiser |
|
|
|
Unused Exports |
|
|
|
Google Apps Script Developer
Amit Agarwal is a web geek, Google Developers Expert, Google Cloud Champion Innovator, Microsoft MVP alumni and author of labnol.org, a popular tech how-to website.