vscode snippets PECEGE

pecege.code-snippets

{
  "Console log": {
    "scope": "javascript,typescript,typescriptreact",
    "prefix": "log",
    "body": [
      "console.log({$1})"
    ],
    "description": "Log output to console"
  },
  "React compenent": {
    "scope": "typescriptreact",
    "prefix": "rc",
    "body": [
      "import * as S from './styles'",
      "type Props = {",
      "   ${3}",
      "}",
      "export function ${TM_DIRECTORY/^.+[\\/\\\\]+(.*)$/$1/}({${2}}:Props){",
      " return(",
      "  <S.Container>",
      "   <h1>${TM_DIRECTORY/^.+[\\/\\\\]+(.*)$/$1/}</h1>",
      "  </S.Container>",
      " )",
      "}"
    ],
    "description": "create react component"
  },
  "Styled component": {
    "scope": "typescript",
    "prefix": "csc",
    "body": [
      "import styled from 'styled-components'",
      "",
      "export const Container = styled.section`",
      "${1}",
      "`;"
    ],
    "description": "create a styled component"
  },
  "useState Snippet": {
    "scope": "typescript,typescriptreact",
    "prefix": "ust",
    "body": [
      "const [${1} ,set${2}] = useState(${3:''})"
    ],
    "description": "useState Snippet"
  },
  "useEffect Snippet": {
    "scope": "typescriptreact",
    "prefix": "uef",
    "body": [
      "useEffect(()=>{${2}},[${1}])"
    ],
    "description": "useEffect Snippet"
  },
  "custom hook": {
    "scope": "typescript,typescriptreact",
    "prefix": "ch",
    "body": [
      "export function ${TM_FILENAME_BASE}(){",
      " return{}",
      "}"
    ],
    "description": "create a custom hook"
  },
  "t translation": {
    "scope": "typescript,typescriptreact",
    "prefix": "ttrans",
    "body": [
      "const {t} = useTranslation()"
    ],
    "description": "create a variable and use the translation hook"
  },
}