vscodeスニペット集

私のVSCODEのスニペットを随時公開していきます。

html.json

{
  "img": {
    "prefix": "img",
    "body": [
      "<img src=\"$1\" width=\"$2\" height=\"$3\" alt=\"$4\" loading=\"${5:lazy}\">",
    ],
    "description": ""
  },
	"noindex":{
		"prefix": "no",
		"body": [
			"<meta name=\"robots\" content=\"noindex\" />"
		],
		"description": ""
	},
	"picture": {
    "prefix": "pic",
    "body": [
      "<picture class=\"$1\">",
      "\t<source srcset=\"$2 1x, $3 2x\" media=\"(max-width: 768px)\" />",
      "\t<source",
      "\t\tsrcset=\"$4 1x, $5 2x\"",
      "\t\tmedia=\"(min-width: 769px)\"",
      "\t/>",
      "\t<img",
      "\t\tsrc=\"$6\"",
      "\t\talt=\"$7\"",
      "\t\twidth=\"\"",
      "\t\theight=\"\"",
      "\t\tloading=\"${10:lazy}\"",
      "\t/>",
      "</picture>",
    ],
    "description": ""
  },
  "PHP": {
    "prefix": "php",
    "body": [
      "<?php $1 ?>"
    ]
	},
}

php.json

{
	"PHP": {
		"prefix": "php",
		"body": [
    	"<?php $1 ?>"
  	]
	},
}

sass.json

独自のfunctionをスニペットにしているので参考にならないかも↓

{
	"vw": {
    "prefix": "vw",
    "body": [
      "g.vw($1px)",
    ],
    "description": ""
  },
	"rem": {
    "prefix": "rem",
    "body": [
      "g.rem($1px)",
    ],
    "description": ""
  },
}