VSCode Settings

vs code settings - instructions.md

System / Auto Light or Dark Mode

To sync your VS Code workbench theme with your operating system's light or dark mode, you need to enable the auto-detect setting.

• Open the Command Palette by pressing
• Ctrl + Shift + P (Windows/Linux) or
• Cmd + Shift + P (macOS).
• Open User Settings (JSON) and press Enter.
• Add the following lines to your configuration.

{
  "window.autoDetectColorScheme": true,
  "workbench.preferredDarkColorTheme": "Default Dark Modern",
  "workbench.preferredLightColorTheme": "Default Light Modern"
}

Funky Color Themes

For funky color themes, follow this link: https://gist.github.com/tangoabcdelta/235764d1c234020c26644387b77f6629

Profile settings for Bash and Z-shell

Tune your .zprofile to verify .bash_profile before proceeding:

# Check if .bash_profile exists and source it
if [ -f "$HOME/.bash_profile" ]; then
    . "$HOME/.bash_profile"
fi

Open VSCode from Terminal

Put a VScode alias in .bash_profile to verify:

alias code="/Applications/Visual\ Studio\ Code.app/Contents/Resources/app/bin/code"

Writing Paths in bash and z-shell

And tune your .zshrc file as well:

export PATH="$HOME/.local/bin:$PATH"

# Add other paths
export PATH="/Users/tangoabcdelta/bin:$PATH"

Excluding Files from VSCode

Temporary Exclusion (Search Sidebar)

If you only want to exclude it for your current search session:

• Open Search
• Press Ctrl + Shift + F (Windows/Linux) or Cmd + Shift + F (Mac).
• Expand Search Options
• Click the three dots (... ) icon below the search input to show more options.
• Files to Exclude: In the "files to exclude" field, type node_modules.
• Toggle Settings: Ensure the gear icon (Use Exclude Settings and Ignore Files) is highlighted/active so that your default exclusions are applied.
• Enter Pattern: Type **/node_modules and click OK.

Hide from File Explorer

Note: If you also want to hide it from the File Explorer (sidebar), repeat this process for the files.exclude setting.

Alternatively, you can add this directly to your settings.json:

file:json"search.exclude": {
    "**/node_modules": true
}

Example File

{
    "window.autoDetectColorScheme": true,
    "workbench.preferredDarkColorTheme": "Dark Modern",
    "workbench.preferredLightColorTheme": "Light Modern",
    "security.workspace.trust.untrustedFiles": "open",
    "debug.javascript.autoAttachFilter": "disabled",
    "search.exclude": {
        "**/node_modules": true
    },
    "files.exclude": {
        "**/dist": true,
        "**/node_modules": true
    },
    "files.watcherExclude": {
        "**/dist": true,
        "**/node_modules": true
    },
    "diffEditor.codeLens": true,
    "workbench.secondarySideBar.defaultVisibility": "hidden",
    "http.proxy": "http://proxy.org.com:9999",
    "http.noProxy": [
        ".org.com",
        ".org-suborg.com",
        ".suborg-org.com",
        "bitly-org",
        "SOMENAME",
        ".local",
        "169.254/16"
    ],
    "http.proxySupport": "override",
    "http.proxyStrictSSL": true,
    "http.systemCertificates": true,
    "http.fetchAdditionalSupport": true,
    "http.systemCertificatesNode": false
}

Puppeteer

Default Directory Path for puppeteer

your-project/
└── node_modules/
    └── puppeteer/
        └── .local-chromium/
            └── mac-722234/
                └── chrome-mac/
                    └── Chromium.app <--- Your app goes here

Skip puppeteer Installation

• Adding puppeteer_skip_chromium_download=true to the root .npmrc is intended for skipping the download process for puppeteer
• Alternatively, you can download and save your chromium binary and save it and add instructions to pick up puppeteer from only the specified locations. Generally, these instructions are kept in a rc file e.g. .puppeteerrc.cjs.

// .puppeteerrc.cjs
// convert this to pupperterrc json config

// PUPPETEER_DOWNLOAD_BASE_URL
// PUPPETEER_CACHE_DIR=/Users/<$USER>/PUPPETEER_CACHE_DIR/chrome-mac/Chromium.app
// PUPPETEER_CACHE_DIR_2=/Applications/Chromium.app
// Note: Leaving downloadBaseUrl as an empty string (or omitting it) tells Puppeteer to use its default hosting URL. If you have a specific internal mirror URL, just pop it inside the quotes!

const fs = require('fs');

// Check if the primary directory exists, otherwise fallback to the second one
const primaryPath = '/Users/<$USER>/PUPPETEER_CACHE_DIR/chrome-mac/Chromium.app';
const fallbackPath = '/Applications/Chromium.app';
const chosenCacheDir = fs.existsSync(primaryPath) ? primaryPath : fallbackPath;

module.exports = {
  downloadBaseUrl: process.env.PUPPETEER_DOWNLOAD_BASE_URL || '',
  cacheDirectory: chosenCacheDir,
};