Skip to content

Instantly share code, notes, and snippets.

@elie222
Last active November 7, 2025 13:06
Show Gist options
  • Select an option

  • Save elie222/1aba38a68ec92f968eec7c67eaca201d to your computer and use it in GitHub Desktop.

Select an option

Save elie222/1aba38a68ec92f968eec7c67eaca201d to your computer and use it in GitHub Desktop.
Favourite VS Code Snippets
{
"Export default": {
"scope": "javascript,typescript,javascriptreact,typescriptreact",
"prefix": "eid",
"body": [
"export { default } from './${TM_DIRECTORY/.*[\\/](.*)$$/$1/}'",
"$2"
],
"description": "Import and export default in a single line"
},
"Filename": {
"prefix": "fn",
"body": ["${TM_FILENAME_BASE}"],
"description": "Print filename"
},
"Import emotion styled": {
"prefix": "imes",
"body": ["import styled from '@emotion/styled'"],
"description": "Import Emotion js as styled"
},
"Import emotion css only": {
"prefix": "imec",
"body": ["import { css } from '@emotion/styled'"],
"description": "Import Emotion css only"
},
"Import emotion styled and css only": {
"prefix": "imesc",
"body": ["import styled, { css } from ''@emotion/styled'"],
"description": "Import Emotion js and css"
},
"Styled component": {
"prefix": "sc",
"body": ["const ${1} = styled.${2}`", " ${3}", "`"],
"description": "Import Emotion js and css"
},
"TypeScript React Function Component": {
"prefix": "rfc",
"body": [
"import React from 'react'",
"",
"interface ${1:ComponentName}Props {",
"}",
"",
"const ${1:ComponentName}: React.FC<${1:ComponentName}Props> = props => {",
" return (",
" <div>",
" ${1:ComponentName}",
" </div>",
" )",
"}",
"",
"export default ${1:ComponentName}",
""
],
"description": "TypeScript React Function Component"
},
"console.log": {
"prefix": "clg",
"body": [
"console.log('$1', $1)"
],
"description": "console.log"
},
"console.log JSON": {
"prefix": "clgj",
"body": [
"console.log('$1', JSON.stringify($1, null, 2))"
],
"description": "console.log JSON"
}
}
@OpShaid
Copy link

OpShaid commented Oct 7, 2025

Good base. "imesc" import’s busted tho, and you could drop redundant semis in the Emotion imports. But overall, tight snippet config.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment