VS Code User Snippets

javascript.json

{
	"Print to console": {
		"prefix": "1",
		"body": [
			"console.log(${TM_LINE_NUMBER}, '$1');",
			"$2"
		],
		"description": "Log output to console"
	},
	"Simple function": {
		"prefix": "fun",
		"body": [
			"function ${1:name}(${2:param}){\n\t $3\n}"
		],
		"description": "simple function"
	},
	"IIFE": {
		"prefix": "iife",
		"body": [
			"(function() {",
			"  $1",
			"}());"
		],
		"description": "Immediately-invoked function expression"
	},
	"Iterate Array": {
		"prefix": "itar",
		"body": [
			"for (var i = 0; i < ${1:array}.length; i++)  {",
			"  var item = ${1:array}[i];",
			"  $3",
			"}"
		],
		"description": "Iterate elements of array"
	},
	"Iterate (for..in)": {
		"prefix": "itob",
		"body": [
			"for (var ${1:prop} in ${2:object})  {",
			"  console.log('${2:object}.' + ${1:prop}, '=', ${2:object}[${1:prop}]);",
			"  $3",
			"}"
		],
		"description": "Iterate (for..in)"
	},
	"qsa": {
		"prefix": "qsa",
		"body": [
			"let ${1:elems} = document.querySelectorAll('${2:.targetQuery}');"
		],
		"description": "qsa"
	},
	"qs": {
		"prefix": "qs",
		"body": [
			"let ${1:elem} = document.querySelector('${2:.targetQuery}');"
		],
		"description": "qs"
	},
	"import": {
		"prefix": "import",
		"body": [
			"import { ${1:module} } from '${1:module}';"
		],
		"description": "import"
	},
	"class": {
		"prefix": "class",
		"body": [
			"/**",
			" * ${1:MyClass} Class ",
			" *",
			" * @class ${1:MyClass}",
			" */",
			"class ${1:MyClass} {",
			"  constructor() {",
			"    ${2:// js}",
			"  }",
			"}"
		],
		"description": "Creates a ES6 Class with JSDocs"
	},
	"sub class": {
		"prefix": "subclass",
		"body": [
			"/**",
			" * ${1:MySubClass} Sub Class of ${2:MyClass}",
			" *",
			" * @class ${1:MySubClass}",
			" * @extends {${2:MyClass}}",
			" */",
			"class ${1:MySubClass} extends ${2:MyClass} {",
			"  constructor() {",
			"    super();",
			"    ${3:// js}",
			"  }",
			"}"
		],
		"description": "Creates a ES6 Sub Class with JSDocs"
	}
}

scss.js

{
/*
	// Place your snippets for Sass here. Each snippet is defined under a snippet name and has a prefix, body and
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
	// same ids are connected.
	// Example:
	"Print to console": {
		"prefix": "log",
		"body": [
			"console.log('$1');",
			"$2"
		],
		"description": "Log output to console"
	}
*/
	"foundation 8 Breakpoint": {
		"prefix": ["break"],
		"body": [
			"@include breakpoint(${1:large}) {",
			"  ${2}",
			"}"
		],
		"description": "Add a Foundation 8 breakpoint mixin."
	},
	"foundation 8 Grid Row": {
		"prefix": "row",
		"body": [
			"@include grid-row;",
			"${1}"
		],
		"description": "Add a Foundation 8 grid row mixin."
	},
	"foundation 8 Column": {
		"prefix": "col",
		"body": [
			"@include grid-column(${1:6});",
			"${2}"
		],
		"description": "Add a Foundation 8 grid column mixin."
	},
	"foundation 8 Advanced Column": {
		"prefix": "col",
		"body": [
			"@include grid-column(",
			"  $columns: ${1:6},",
			"  $gutters: ${2:1},",
			")",
			"${3}"
		],
		"description": "Add a Foundation 8 advanced grid column mixin. With $columns and $gutters settings."
	}
}