Skip to content

Instantly share code, notes, and snippets.

@ShayanTheNerd
Last active January 5, 2026 13:10
Show Gist options
  • Select an option

  • Save ShayanTheNerd/ccdef0870ffbf72534a9f668ed56443d to your computer and use it in GitHub Desktop.

Select an option

Save ShayanTheNerd/ccdef0870ffbf72534a9f668ed56443d to your computer and use it in GitHub Desktop.
VS Code settings, keybindings, snippets, and extensions
root = true
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true
{
"recommendations": [
"astro-build.astro-vscode",
"naumovs.color-highlight",
"pucelle.vscode-css-navigation",
"vunguyentuan.vscode-css-variables",
"rexebin.dracula",
"EditorConfig.EditorConfig",
"usernamehw.errorlens",
"dbaeumer.vscode-eslint",
"github.copilot",
"gitHub.copilot-chat",
"SanjulaGanepola.github-local-actions",
"eamodio.gitlens",
"antfu.iconify",
"ritwickdey.liveserver",
"nuxtr.nuxtr-vscode",
"oxc.oxc-vscode",
"ms-playwright.playwright",
"csstools.postcss",
"Postman.postman-for-vscode",
"esbenp.prettier-vscode",
"bradlc.vscode-tailwindcss",
"jgclark.vscode-todo-highlight",
"chakrounanas.turbo-console-log",
"vitest.explorer",
"vscode-icons-team.vscode-icons",
"vue.volar",
"wakatime.vscode-wakatime"
]
}
[
/*** Reload Window ***/
{
"key": "F5",
"command": "workbench.action.reloadWindow"
},
/*** Reset Zoom ***/
{
"key": "ctrl+escape",
"command": "workbench.action.zoomReset"
},
/*** Close All Editors ***/
{
"key": "cmd+shift+w",
"command": "workbench.action.closeAllEditors"
},
/*** Open Settings & Keybindings (JSON) ***/
{
"key": "cmd+,",
"command": "workbench.action.openSettingsJson"
},
{
"key": "ctrl+,",
"command": "workbench.action.openGlobalKeybindingsFile"
},
/*** Activity Panels ***/
{
"key": "ctrl+shift+e",
"command": "workbench.view.explorer"
},
{
"key": "ctrl+shift+g",
"command": "workbench.view.scm"
},
{
"key": "ctrl+shift+s",
"command": "workbench.action.findInFiles"
},
{
"key": "ctrl+shift+x",
"command": "workbench.view.extensions"
},
/*** GitHub Copilot's Panel ***/
{
"key": "cmd+shift+b",
"command": "workbench.action.toggleAuxiliaryBar"
},
{
"key": "cmd+shift+i",
"command": "workbench.action.chat.openask"
},
{
"key": "cmd+shift+i",
"command": "workbench.action.closeAuxiliaryBar",
"when": "inChat && chatInputHasFocus"
},
{
"key": "ctrl+f",
"command": "workbench.action.toggleMaximizedAuxiliaryBar",
"when": "chatInputHasFocus"
},
{
"key": "cmd+n",
"command": "workbench.action.chat.newChat",
"when": "chatInputHasFocus"
},
/*** Create New Files & Folders ***/
{
"key": "cmd+n",
"command": "explorer.newFile",
"when": "!chatInputHasFocus && !terminalFocus"
},
{
"key": "cmd+shift+n",
"command": "explorer.newFolder",
"when": "!chatInputHasFocus && !terminalFocus"
},
/*** Find Characters & Files/Folders ***/
{
"key": "cmd+f",
"command": "actions.find",
"when": "editorFocus"
},
{
"key": "cmd+f",
"command": "list.find",
"when": "filesExplorerFocus"
},
/*** Terminal Panel ***/
{
"key": "cmd+t",
"command": "workbench.action.terminal.toggleTerminal"
},
{
"key": "cmd+k",
"command": "workbench.action.terminal.clear",
"when": "terminalFocus"
},
{
"key": "cmd+shift+k",
"command": "workbench.action.terminal.kill",
"when": "terminalFocus"
},
{
"key": "ctrl+f",
"command": "workbench.action.toggleMaximizedPanel",
"when": "terminalFocus"
},
{
"key": "cmd+n",
"command": "workbench.action.terminal.new",
"when": "terminalFocus"
},
/*** Format the Document ***/
{
"key": "ctrl+f",
"command": "editor.action.formatDocument",
"when": "!editorReadonly && editorTextFocus"
},
/*** Toggle Comment ***/
{
"key": "cmd+/",
"command": "editor.action.commentLine",
"when": "!editorReadonly && editorTextFocus"
},
{
"key": "cmd+shift+/",
"command": "editor.action.blockComment",
"when": "!editorReadonly && editorTextFocus"
},
/*** Duplicate & Delete Current Line ***/
{
"key": "cmd+d",
"command": "editor.action.copyLinesUpAction",
"when": "!editorReadonly && editorTextFocus"
},
{
"key": "cmd+backspace",
"command": "editor.action.deleteLines",
"when": "!editorReadonly && textInputFocus"
},
/*** Add Selection to Next/Previous Match ***/
{
"key": "ctrl+shift+n",
"command": "editor.action.addSelectionToNextFindMatch",
"when": "!editorReadonly && editorTextFocus && editorHasSelection"
},
{
"key": "ctrl+shift+p",
"command": "editor.action.addSelectionToPreviousFindMatch",
"when": "!editorReadonly && editorTextFocus && editorHasSelection"
},
{
"key": "shift+cmd+r",
"command": "editor.action.changeAll",
"when": "!editorReadonly && editorTextFocus && editorHasSelection"
},
/*** Variable Rename Suggestions ***/
{
"key": "cmd+r",
"command": "editor.action.rename"
},
/*** Go to Definition ***/
{
"key": "ctrl+enter",
"command": "editor.action.revealDefinition",
"when": "editorHasDefinitionProvider && editorTextFocus"
},
/*** Add JS/TS Console Logger (`console.log()`) ***/
{
"key": "cmd+shift+l",
"command": "turboConsoleLog.displayLogMessage",
"when": "!editorReadonly && editorTextFocus && editorHasSelection"
},
/*** Disable the Conflicting Defaults ***/
{
"key": "cmd+j",
"command": "-workbench.action.togglePanel"
},
{
"key": "cmd+t",
"command": "-workbench.action.showAllSymbols"
},
{
"key": "cmd+shift+.",
"command": "-breadcrumbs.toggleToOn"
},
{
"key": "cmd+shift+k",
"command": "-editor.action.deleteLines"
},
{
"key": "cmd+shift+m",
"command": "-workbench.actions.view.problems"
},
{
"key": "cmd+shift+n",
"command": "-workbench.action.newWindow"
},
{
"key": "cmd+shift+r",
"command": "-rerunSearchEditorSearch",
"when": "inSearchEditor"
},
{
"key": "ctrl+`",
"command": "-workbench.action.terminal.toggleTerminal"
},
{
"key": "ctrl+l",
"command": "-workbench.action.chat.newChat"
},
{
"key": "ctrl+shift+`",
"command": "-workbench.action.terminal.new"
},
{
"key": "ctrl+shift+a",
"command": "-cursorLineStartSelect"
},
{
"key": "ctrl+shift+m",
"command": "-editor.action.toggleTabFocusMode"
},
{
"key": "cmd+k cmd+k",
"command": "-editor.action.defineKeybinding"
},
{
"key": "cmd+k cmd+w",
"command": "-workbench.action.closeAllEditors"
}
]
{
/*** WINDOW ***/
"window.commandCenter": false,
"window.zoomLevel": 1,
/*** EXPLORER ***/
"explorer.autoReveal": true,
"explorer.compactFolders": false,
"explorer.confirmDragAndDrop": false,
"explorer.decorations.badges": false,
"explorer.incrementalNaming": "smart",
/*** WORKBENCH ***/
"workbench.activityBar.location": "top",
"workbench.colorCustomizations": {
"editor.findMatchBackground": "#264F78",
"editor.foreground": "#d1d1d1",
"editor.selectionBackground": "#1e3f60"
},
"workbench.colorTheme": "Darcula - WebStorm Edition",
"workbench.editorAssociations": {
"*.svg": "default"
},
"workbench.iconTheme": "vscode-icons",
"workbench.layoutControl.enabled": false,
"workbench.list.smoothScrolling": true,
"workbench.navigationControl.enabled": false,
"workbench.settings.showAISearchToggle": true,
"workbench.sideBar.location": "right",
"workbench.tips.enabled": false,
"workbench.tree.indent": 14.5,
"workbench.tree.renderIndentGuides": "always",
"workbench.editor.untitled.labelFormat": "name",
/*** Zen Mode ***/
"zenMode.centerLayout": false,
"zenMode.fullScreen": false,
"zenMode.hideLineNumbers": false,
"zenMode.silentNotifications": false,
/*** FILES ***/
"files.associations": {
".gitmessage": "git-commit",
"{.editorconfig,.gitattributes}": "properties",
"*.code-snippets": "snippets",
"*.mdx": "markdown",
"*.{svg,xml}": "html"
},
"files.autoSaveDelay": 500,
"files.eol": "\n",
"files.simpleDialog.enable": true,
"files.trimTrailingWhitespace": true,
/*** SEARCH ***/
"search.exclude": {
"**/dist": true,
"**/node_modules": true,
"**/*-lock.{yaml,json}": true,
"**/*.code-search": true,
"**/*.lock": true
},
"search.quickOpen.includeHistory": false,
"search.searchView.keywordSuggestions": true,
"search.searchView.semanticSearchBehavior": "auto",
/*** EDITOR ***/
/* Indentation */
"editor.autoIndentOnPaste": true,
"editor.detectIndentation": false,
"editor.glyphMargin": false,
"editor.inlayHints.padding": true,
"editor.indentSize": 2,
"editor.lineDecorationsWidth": 10,
"editor.renderFinalNewline": "dimmed",
"editor.renderWhitespace": "all",
"editor.showFoldingControls": "always",
"editor.tabSize": 2,
"editor.wordWrap": "wordWrapColumn",
"editor.wordWrapColumn": 120,
"editor.wrappingIndent": "indent",
/* Selection */
"editor.emptySelectionClipboard": false,
"editor.smartSelect.selectLeadingAndTrailingWhitespace": false,
"editor.wordSeparators": "`~!@#$%^&*()[]{}-–—=+\\|;:'\",.<>/?“”«»",
/* Smart Suggestion */
"editor.acceptSuggestionOnEnter": "smart",
"editor.quickSuggestions": {
"comments": true,
"other": true,
"strings": true
},
"editor.quickSuggestionsDelay": 0,
"editor.snippetSuggestions": "inline",
"editor.suggest.localityBonus": true,
"editor.suggestSelection": "recentlyUsedByPrefix",
"editor.tabCompletion": "onlySnippets",
"emmet.excludeLanguages": [],
"emmet.includeLanguages": {
"md": "html",
"markdown": "html"
},
"emmet.syntaxProfiles": {
"postcss": "css",
"tailwindcss": "css"
},
/* Typography */
"editor.bracketPairColorization.independentColorPoolPerBracketType": true,
"editor.fontSize": 14,
"editor.fontFamily": "Maple Mono NF, SeriousShanns Nerd Font, Comic Mono, Comic Shanns Mono, Dubai",
"editor.fontLigatures": "'calt', 'ss01', 'ss03', 'ss04', 'ss05', 'ss06', 'ss07', 'ss10', 'ss11'",
"editor.letterSpacing": 0.25,
"editor.lineHeight": 30,
"editor.maxTokenizationLineLength": 2000,
"editor.renderLineHighlight": "all",
"editor.suggestFontSize": 13,
"editor.unicodeHighlight.ambiguousCharacters": false,
/* Formatting */
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.fixAll.oxc": "explicit",
"source.organizeImports": "never",
"source.sort.json": "never",
"source.sortImports": "never"
},
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
// Diff Editor
"diffEditor.ignoreTrimWhitespace": false,
"diffEditor.maxFileSize": 0,
/* Animations */
"editor.cursorBlinking": "expand",
"editor.cursorSmoothCaretAnimation": "on",
"editor.smoothScrolling": true,
/* Miscellaneous */
"breadcrumbs.enabled": false,
"editor.accessibilitySupport": "off",
"editor.gotoLocation.multipleDefinitions": "goto",
"editor.linkedEditing": true,
"editor.minimap.enabled": false,
"editor.pasteAs.preferences": ["text.updateImports.jsts", "html"],
"editor.scrollOnMiddleClick": true,
"editor.stickyScroll.enabled": false,
"references.preferredLocation": "view",
/*** TERMINAL ***/
"terminal.integrated.cursorStyle": "line",
"terminal.integrated.enableMultiLinePasteWarning": "never",
"terminal.integrated.fontFamily": "Maple Mono NF, SeriousShanns Nerd Font",
"terminal.integrated.fontSize": 13,
"terminal.integrated.fontLigatures.enabled": true,
"terminal.integrated.fontLigatures.featureSettings": "'calt', 'ss01', 'ss03', 'ss04', 'ss05', 'ss06', 'ss07', 'ss10', 'ss11'",
"terminal.integrated.letterSpacing": 2,
"terminal.integrated.lineHeight": 1.5,
"terminal.integrated.scrollback": 5000,
"terminal.integrated.smoothScrolling": true,
"terminal.integrated.stickyScroll.enabled": true,
"terminal.integrated.suggest.enabled": true,
"terminal.integrated.suggest.inlineSuggestion": "alwaysOnTopExceptExactMatch",
"terminal.integrated.suggest.quickSuggestions": {
"unknown": "on",
"commands": "on",
"arguments": "on"
},
"terminal.integrated.wordSeparators": "`~!@#$%^&*()[]{}-–—=+\\|;:'\",.<>/?“”«»",
/*** TOOLS & LANGUAGES ***/
/* JavaScript & TypeScript */
"javascript.inlayHints.functionLikeReturnTypes.enabled": true,
"javascript.preferences.importModuleSpecifierEnding": "js",
"javascript.preferences.quoteStyle": "single",
"javascript.referencesCodeLens.enabled": true,
"javascript.referencesCodeLens.showOnAllFunctions": true,
"javascript.suggest.completeFunctionCalls": true,
"typescript.implementationsCodeLens.enabled": true,
"typescript.inlayHints.functionLikeReturnTypes.enabled": true,
"typescript.preferences.autoImportSpecifierExcludeRegexes": ["^(node:)?console$"],
"typescript.preferences.importModuleSpecifierEnding": "js",
"typescript.preferences.preferTypeOnlyAutoImports": true,
"typescript.referencesCodeLens.enabled": true,
"typescript.referencesCodeLens.showOnAllFunctions": true,
"typescript.suggest.completeFunctionCalls": true,
"typescript.tsserver.maxTsServerMemory": 4096, // 4GB
"javascript.updateImportsOnFileMove.enabled": "always",
"typescript.updateImportsOnFileMove.enabled": "always",
"js/ts.implicitProjectConfig.target": "ESNext",
/* Git */
"git.autofetch": true,
"git.confirmSync": false,
"git.enableCommitSigning": true,
"git.enableSmartCommit": true,
"git.mergeEditor": true,
"git.openRepositoryInParentFolders": "always",
"git.rebaseWhenSync": true,
"[git-commit]": {
"editor.rulers": [50, 72]
},
/* Markdown */
"markdown.occurrencesHighlight.enabled": true,
"markdown.validate.enabled": true,
/* CSS */
"css.lint.fontFaceProperties": "error",
"css.format.spaceAroundSelectorSeparator": true,
"css.lint.unknownAtRules": "ignore",
/*** EXTENSIONS ***/
"extensions.experimental.deferredStartupFinishedActivation": true,
/* Color Highlight */
"color-highlight.matchWords": true,
/* CSS Navigation */
"CSSNavigation.activeHTMLFileExtensions": ["html", "jsx", "tsx", "mdx", "astro", "vue", "php", "py"],
"CSSNavigation.searchAcrossWorkspaceFolders": true,
/* Error Lens */
"errorLens.editorHoverPartsEnabled": {
"buttonsEnabled": true,
"messageEnabled": true,
"sourceCodeEnabled": true
},
"errorLens.enableOnDiffView": true,
"errorLens.gutterEmoji": {
"hint": "🟩",
"info": "🟦",
"error": "🟥",
"warning": "🟨"
},
"errorLens.gutterIconsEnabled": true,
"errorLens.ignoreUntitled": true,
"errorLens.respectUpstreamEnabled": { "statusBar": true },
"errorLens.statusBarIconsUseBackground": false,
/* ESLint */
"eslint.format.enable": true,
"eslint.ignoreUntitled": true,
"eslint.lintTask.enable": true,
"eslint.run": "onSave",
/* GitHub Copilot */
"chat.agent.thinkingStyle": "collapsed",
"chat.commandCenter.enabled": false,
"chat.viewSessions.orientation": "stacked",
"github.copilot.chat.cli.customAgents.enabled": true,
"github.copilot.chat.codesearch.enabled": true,
"github.copilot.chat.generateTests.codeLens": true,
"github.copilot.chat.languageContext.fix.typescript.enabled": true,
"github.copilot.chat.languageContext.inline.typescript.enabled": true,
"github.copilot.chat.languageContext.typescript.enabled": true,
"github.copilot.enable": {
"*": true,
"markdown": true,
"plaintext": true,
"scminput": true,
"yaml": true
},
"github.copilot.nextEditSuggestions.allowWhitespaceOnlyChanges": true,
"github.copilot.nextEditSuggestions.enabled": true,
"github.copilot.nextEditSuggestions.fixes": true,
/* GitHub Local Actions */
"githubLocalActions.dockerDesktopPath": "/Applications/Docker.app",
/* GitLens */
"gitlens.codeLens.authors.enabled": false,
"gitlens.codeLens.recentChange.enabled": false,
"gitlens.graph.minimap.additionalTypes": ["localBranches", "stashes", "remoteBranches", "pullRequests", "tags"],
"gitlens.graph.minimap.enabled": false,
/* Iconify IntelliSense */
"iconify.inplace": false,
/* Nuxtr */
"nuxtr.openItemsAfterCreation": true,
"nuxtr.piniaFiles.defaultTemplate": "setup",
"nuxtr.vueFiles.firstTag": "script",
"nuxtr.vueFiles.style.addStyleTag": false,
"nuxtr.vueFiles.style.alwaysScoped": true,
/* Oxc */
"oxc.lint.run": "onSave",
/* Prettier */
"prettier.jsxSingleQuote": true,
"prettier.printWidth": 120,
"prettier.quoteProps": "consistent",
"prettier.singleQuote": true,
"prettier.trailingComma": "all",
/* Tailwind CSS IntelliSense */
"tailwindCSS.emmetCompletions": true,
/* Todo Highlight */
"todohighlight.exclude": [
"**/*.map",
"**/*.min.*",
"**/dist/**",
"**/build/**",
"**/.nuxt/**",
"**/.next/**",
"**/.github/**",
"**/.output/**",
"**/_output/**",
"**/.vscode-test/**",
"**/node_modules/**",
"**/bower_components/**"
],
"todohighlight.include": [
"**/*.txt",
"**/*.md",
"**/*.json",
"**/*.jsonc",
"**/*.yml",
"**/*.yaml",
"**/*.toml",
"**/*.svg",
"**/*.html",
"**/*.css",
"**/*.scss",
"**/*.js",
"**/*.ts",
"**/*.cjs",
"**/*.cts",
"**/*.mjs",
"**/*.mts",
"**/*.jsx",
"**/*.tsx",
"**/*.vue",
"**/*.astro",
"**/*.gql",
"**/*.graphql",
"**/*.java",
"**/.zshrc",
"**/.gitmessage",
"**/Dockerfile",
"**/.dockerignore",
"**/.oxlintrc.json",
"**/*.code-snippets"
],
"todohighlight.isCaseSensitive": false,
"todohighlight.defaultStyle": {
"color": "#dadada",
"borderRadius": "4px",
"backgroundColor": "#1e1e1e",
"overviewRulerColor": "transparent"
},
"todohighlight.keywords": [
{
// Highlight the whole line if it contains `### ... ###`, `<!--- ... -->`, or `/*** ... ***/`.
"text": "(#{3}.*?#{3})|(\\/\\*{3}[^\\*]*\\*{3}\\/)|(<\\!-{3}[^<]*-{3}>)",
"regex": {
"pattern": "(#{3}.*?#{3})|(\\/\\*{3}[^\\*]*\\*{3}\\/)|(<\\!-{3}[^<]*-{3}>)"
},
"color": "#e6e6e6",
"isWholeLine": true,
"borderRadius": "0px",
"backgroundColor": "#3c3c3c"
},
{
// Highlight text between backticks within single-line comments (`# ...` or `// ...`).
"text": "(?<=(?:#|//).*?)`[^`\n]*`",
"regex": { "pattern": "(?<=(?:#|//).*?)`[^`\n]*`" }
},
{
// Highlight text between backticks within multi-line comments (`<!-- ... -->` or `/* ... */`).
/* It's an issue when the comment's starting signature (`<!--` or `/*`) is repeated whitin itself. */
"text": "(?<=\\/(?:\\*|\\*\\*)[^*]*?|<!--[^>]*?)(?<!`)(`[^`]*?`)(?=[^*]*?\\*\\/|[^<]*?-->)",
"regex": {
"pattern": "(?<=\\/(?:\\*|\\*\\*)[^*]*?|<!--[^>]*?)(?<!`)(`[^`]*?`)(?=[^*]*?\\*\\/|[^<]*?-->)"
}
}
],
/* Turbo Console Log */
"turboConsoleLog.addSemicolonInTheEnd": true,
"turboConsoleLog.delimiterInsideMessage": ">",
"turboConsoleLog.includeLineNum": true,
"turboConsoleLog.logMessagePrefix": "",
"turboConsoleLog.logMessageSuffix": "",
"turboConsoleLog.quote": "`",
"turboConsoleLog.insertEnclosingFunction": false,
/* VS Code Icons */
"vsicons.associations.folders": [
{ "extensions": ["(view)", "(views)"], "icon": "view" },
{ "extensions": ["_component", "_components"], "icon": "component" },
{ "extensions": ["_helper", "_helpers"], "icon": "helper" },
{ "extensions": ["_types", "_@types"], "icon": "typings" },
{ "extensions": ["_util", "_utils", "_utilities"], "icon": "tools" },
{ "extensions": ["content"], "icon": "docs" },
{ "extensions": ["dto", "dtos"], "icon": "model" },
{ "extensions": ["layout", "layouts", "_layout", "_layouts"], "icon": "mjml" }
],
"vsicons.associations.files": [
{
"extensions": ["vitest.nuxt.config.ts"],
"icon": "vitest",
"filename": true
}
],
"vsicons.dontShowNewVersionMessage": true,
/* Vue (Official) */
"vue.autoInsert.dotValue": true,
"vue.editor.reactivityVisualization": false,
"vue.format.wrapAttributes": "preserve-aligned",
"vue.inlayHints.destructuredProps": true,
"vue.inlayHints.missingProps": true,
"vue.suggest.componentNameCasing": "alwaysPascalCase",
"vue.suggest.propNameCasing": "alwaysCamelCase"
}
{
/*** Todo Comments ***/
"Global": {
"prefix": "todo",
"body": "[TODO] $0"
},
/*** .editorconfig ***/
"Editor Configurations": {
"scope": "editorconfig,properties",
"prefix": "editorconfig",
"body": [
"root = true",
"",
"[*]",
" charset = utf-8",
" end_of_line = lf",
" indent_size = 2",
" indent_style = space",
" insert_final_newline = true",
" trim_trailing_whitespace = true",
]
},
/*** .gitattributes ***/
"Git Attributes": {
"scope": "gitattributes,properties",
"prefix": "gitattributes",
"body": "* text=auto eol=lf",
},
/*** .gitmessage ***/
"Git Commit Message Template": {
"scope": "gitmessage,git-commit",
"prefix": "gitmessage",
"body": [
"# ====================================== Template =======================================",
"# <type>[(scope)][!]: <summary> (maximum 50 characters)",
"",
"# [body]: Explain WHY you are making this change, not HOW. (wrap lines at 72 characters)",
"",
"# [footer]",
"# Signed-off-by: <name> (<email address>)",
"# Reviewed-by: <name> (@<GitHub username>)",
"# References/Fixes: #<GitHub issue number>",
"# =======================================================================================",
"",
"",
"# =================================== Commit Message ====================================",
"",
"# =======================================================================================",
"",
"",
"# ==================================== Specification ====================================",
"# https://conventionalcommits.org - <required field> - [optional field]",
"",
"# Remember to:",
"# - not capitalize the subject line, nor end it with a period;",
"# - separate subject, body, footer, and paragraphs with a blank line;",
"# - start multi-line bullet points with 2 whitespaces followed by \"-\";",
"# - use the imperative, present tense (e.g., \"fix\" not \"fixed\" nor \"fixes\").",
"",
"# | Type | Description |",
"# | ----------- | --------------------------------------------------------------------- |",
"# | build | Changes that affect the build system or external dependencies |",
"# | chore | Minor maintenance activities — no production code change |",
"# | ci | Changes to CI configuration files or scripts |",
"# | docs | Changes or additions to the documentation |",
"# | feat | Introduction of a new feature |",
"# | fix | Correction of bugs or issues |",
"# | perf | Optimizations that improve the performance of production code |",
"# | refactor | Code revisions and improvements — no production code change |",
"# | revert | Reversion to a previous commit |",
"# | style | Code style changes that don't affect functionality |",
"# | test | Addition or refactoring of tests — no production code change |",
"# =======================================================================================",
]
},
/*** tsconfig.json ***/
"TypeScript Configuration": {
"scope": "json,jsonc",
"prefix": "tsconfig",
"body": [
"{",
" \"compilerOptions\": {",
" /* Type Checking */",
" \"allowUnreachableCode\": false,",
" \"noFallthroughCasesInSwitch\": true,",
" \"noImplicitOverride\": true,",
" \"noImplicitReturns\": true,",
" \"noUncheckedIndexedAccess\": true,",
" \"noUnusedLocals\": true,",
" \"noUnusedParameters\": true,",
" \"strict\": true,",
"",
" /* Modules */",
" \"allowArbitraryExtensions\": true,",
" \"allowImportingTsExtensions\": true,",
" \"module\": \"nodenext\",",
" \"noUncheckedSideEffectImports\": true,",
" \"resolveJsonModule\": true,",
"",
" /* Emit */",
" \"declaration\": true,",
" \"emitDeclarationOnly\": true,",
" \"noEmit\": true,",
"",
" /* JavaScript Support */",
" \"allowJs\": true,",
" \"checkJs\": true,",
"",
" /* Interop Constraints */",
" \"erasableSyntaxOnly\": true,",
" \"esModuleInterop\": true,",
" \"verbatimModuleSyntax\": true,",
"",
" /* Language and Environment */",
" \"moduleDetection\": \"force\",",
" \"target\": \"esnext\",",
"",
" /* Projects */",
" \"incremental\": true,",
" \"tsBuildInfoFile\": \"node_modules/.cache/.tsbuildinfo\",",
"",
" /* Completeness */",
" \"skipLibCheck\": true",
" }",
"}"
]
},
/*** HTML ***/
"HTML Boilerplate": {
"scope": "html",
"prefix": "html-boilerplate",
"body": [
"<!DOCTYPE html>",
"<html lang=\"en\" dir=\"ltr\">",
" <head>",
" <meta charset=\"UTF-8\" />",
" <title>${1:Document}</title>",
" <meta name=\"color-scheme\" content=\"dark\" />",
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
" </head>",
"",
" <body></body>",
"</html>",
]
},
/*** CSS ***/
"Basic Reset": {
"scope": "css,scss,tailwindcss,vue,astro",
"prefix": "reset",
"body": [
":where(*, *::before, *::after) {",
" margin: 0;",
" padding: 0;",
" box-sizing: border-box;",
" font-family: inherit;",
" -webkit-font-smoothing: antialiased;",
"}",
"html {",
" /* By default, “1rem == 16px” and “1rem == 10px” is preferred => “10px / 16px === 0.625 === 62.5%” */",
" /* font-size: 62.5%; */",
" /* font-size: calc(1.0625rem + 0.2604vw); reference: https://jameshfisher.com/2024/03/12/a-formula-for-responsive-font-size/ */",
" font-size: calc(15px + 0.390625vw); /* reference: https://matthewjamestaylor.com/responsive-font-size */",
"}",
"body {",
" font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu, 'Helvetica Neue', sans-serif;",
" padding: calc(8px + 1.5625vw); /* reference: https://matthewjamestaylor.com/responsive-padding */",
" min-height: 100vh;",
" display: grid;",
" place-content: center;",
" /* color: #353535; */",
" /* background-color: #f5f5f5; */",
"}",
]
},
"Media query": {
"scope": "css,scss,tailwindcss,vue,astro",
"prefix": "media query min",
"body": [
"@media screen and (min-width: $1em) {",
" $0",
"}"
]
},
/*** JavaScript & TypeScript ***/
"Get Element By ID": {
"scope": "javascript,typescript",
"prefix": "getId",
"body": "document.getElementById('$1')$0"
},
"Get The First Element By CSS Selector": {
"scope": "javascript,typescript",
"prefix": "query",
"body": "document.querySelector('$1')$0"
},
"Get All Elements By CSS Selector": {
"scope": "javascript,typescript",
"prefix": "queryAll",
"body": "document.querySelectorAll('$1')$0"
},
"Add Class": {
"scope": "javascript,typescript",
"prefix": ".addClass",
"body": ".classList.add('$0')"
},
"Remove Class": {
"scope": "javascript,typescript",
"prefix": ".removeClass",
"body": ".classList.remove('$0')"
},
"Arrow Function": {
"scope": "javascript,typescript",
"prefix": "arrowFunc",
"body": "(${1:event}) => {$0}"
},
"Anonymous Function": {
"scope": "javascript,typescript",
"prefix": "anonymousFunc",
"body": [
"(${1:event}) => {",
" $0",
"}"
]
},
"IIFE (Immediately-Invoked Function Expression)": {
"scope": "javascript,typescript",
"prefix": "iife",
"body": [
"(function ${1:name}(${2:event}) {",
" $0",
"})()"
]
},
"Promise": {
"scope": "javascript,typescript",
"prefix": "promise",
"body": [
"new Promise((resolve, reject) => {",
" $0",
"})"
]
},
"Then": {
"scope": "javascript,typescript",
"prefix": ".then",
"body": ".then(response => {$0}).catch(error => {})"
},
"Pinia Options Store Boilerplate": {
"scope": "javascript,typescript",
"prefix": "pinia-options",
"body": [
"import { defineStore, acceptHMRUpdate } from 'pinia';",
"",
"export const use${TM_FILENAME_BASE/^(.*)$/${1:/pascalcase}/}Store = defineStore('$TM_FILENAME_BASE', {",
" state: () => ({",
" $0",
" }),",
" getters: {},",
" actions: {},",
"})",
"",
"const HMR = import.meta.hot",
"if (HMR) {",
" HMR.accept(acceptHMRUpdate(use${TM_FILENAME_BASE/^(.*)$/${1:/pascalcase}/}Store, HMR))",
"}"
]
},
"Pinia Setup Store Boilerplate": {
"scope": "javascript,typescript",
"prefix": "pinia-setup",
"body": [
"import { defineStore, acceptHMRUpdate } from 'pinia';",
"",
"export const use${TM_FILENAME_BASE/^(.*)$/${1:/pascalcase}/}Store = defineStore('$TM_FILENAME_BASE', () => {",
" $0",
" return {}",
"})",
"",
"const HMR = import.meta.hot",
"if (HMR) {",
" HMR.accept(acceptHMRUpdate(use${TM_FILENAME_BASE/^(.*)$/${1:/pascalcase}/}Store, HMR))",
"}"
]
},
/*** Vue ***/
"Vue SFC Boilerplate": {
"scope": "vue",
"prefix": "sfc",
"body": [
"<script setup lang=\"ts\">",
"",
"</script>",
"",
"<template>",
" $0",
"</template>",
"",
"<style scoped></style>"
]
},
"Vue SFC <script>": {
"scope": "vue",
"prefix": "script",
"body": [
"<script setup lang=\"ts\">",
"$0",
"</script>",
]
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment