Salesforce VSCode LWC Snippets

README.md

Salesforce VSCode LWC Snippets

Some handy VSCode snippets I've found helpful for LWC development in Salesforce.

javascript.json

{
  "Import Salesforce Apex Method": {
    "prefix": "apexImport",
    "body": [
      "import ${3:name} from '@salesforce/apex/${1:class}.${2:method}';"
    ]
  },
  "Import Salesforce Custom Labels": {
    "prefix": "labelImport",
    "body": [
      "import ${2:importAs} from '@salesforce/label/c.${1:customLabel}';"
    ]
  },
  "Import Salesforce Custom Component": {
    "prefix": "componentImport",
    "body": [
      "import ${1:component} from 'c/${1:component}';"
    ]
  },
  "Import Salesforce Custom Component Methods": {
    "prefix": "componentMethodImport",
    "body": [
      "import { ${2:methods} } from 'c/${1:component}';"
    ]
  },
  "Import Salesforce Static Resources": {
    "prefix": "labelResource",
    "body": [
      "import ${2:importAs} from '@salesforce/resourceUrl/${1:staticResource}';"
    ]
  },
	"LWC Setter/Getter": {
	  "prefix": "lwcSet",
	  "body": [
		  "_${1:property} = ${2:defaultValue};",
		  "",
		  "@api",
		  "get ${1:property}() {",
		  "	return this._${1:property};",
		  "}",
		  "",
		  "set ${1:property}(value) {",
		  "	this._${1:property} = value;",
		  "}"
	  ],
	  "description" : "Basic Setter/Getter pattern with private property."
	},
  "Apex Wire Method": {
    "prefix": "apexWire",
    "body": [
      "@wire(${1:apexMethod}, { ${2:parameters} })",
      "${1:apexMethod}Wire({ data, error }) {",
      "	if (data) {",
      "		console.log('%c${1:apexMethod}Wire():', 'color:green', data);",
      "	} else if (error) {",
      "		console.error('${1:apexMethod}Wire():', error);",
      "	}",
      "}"
    ],
    "description" : "Quick wire structure for loading Apex methods."
  },
  "Apex Promise": {
    "prefix": "apexPromise",
    "body": [
      "${1:apexMethod}({ ${2:arguments} })",
      "	.then((response) => {",
      "		console.log('%c${1:apexMethod}():', 'color:green', response);"
      "	})",
      "	.catch((error) => console.error('${1:apexMethod}():', error))",
      "	.finally(() => {",
      "		// this.isBusy = false;",
      "	});"
    ],
    "description" : "Quick promise structure for loading Apex methods imperatively."
  },
  "LWC Section Structure": {
    "prefix": "lwcStructure",
    "body": [
      "// --- Private Properties ---",
      "",
      "",
      "",
      "// --- Public Properties ---",
      "",
      "",
      "",
      "// --- Public Getter/Setter Properties ---",
      "",
      "",
      "",
      "// --- Wire Methods ---",
      "",
      "",
      "",
      "// --- Lifecycle Hooks ---",
      "",
      "",
      "",
      "// --- Private Methods ---",
      "",
      "",
      "",
      "// --- Public Methods ---",
      "",
      "",
      "",
      "// --- Getters ---",
      "",
      "",
      "",
      "// --- Event Handlers ---"
    ],
    "description" : "Quick promise structure for loading Apex methods imperatively."
  }
}