JavaScript Snippets

This is a small collection of useful JavaScript snippets for VS Code.

Features

Console Logs

Shortcut	Command
`cl`	`console.log('foo: ', foo)`
`clog`	`console.log(foo)`
`cljson`	`console.log(JSON.stringify(foo, null, 2))`
`clobj`	`console.log({ foo })`
`cleslint`	`// eslint-disable-next-line no-console \n console.log('$1: ', $1)`

Eslint

Shortcut	Command
`esdisable`	`/* eslint-disable @typescript-eslint/no-unused-vars */`
`esdisablenextline`	`/* eslint-disable-next-line @typescript-eslint/no-unused-vars */`

Import Statements

Shortcut	Command
`imp`	`import defaultExport from 'module'`
`impn`	`import { namedExport } from 'module'`

Jest Unit Tests

Shortcut	Command
`testfile`	Unit test boilerplate
`testdescribe`	`describe('', () => {})`
`testspec`	`it('', () => {})`
`testassert`	`expect(variable).toEqual(result)`

React

Shortcut	Command
`react-typescript`	React component boilerplate
`reactnative-typescript`	React Native component boilerplate
`useEffectHook`	React useEffect hook boilerplate

Install Instructions

This extension can be installed through the VS Code Marketplace:

https://marketplace.visualstudio.com/items?itemName=ezrafree.js-snippets

For development, you can also install manually through git:

cd ~/.vscode/extensions
git clone git@github.com:ezrafree/vscode-javascript-snippets.git ezrafree.js-snippets

Configuring

You may want to disable keywords in your configuration to make accessing snippets easier:

{
  "[javascript]": {
    "editor.suggest.showKeywords": false
  },
  "[javascriptreact]": {
    "editor.suggest.showKeywords": false
  },
  "[typescript]": {
    "editor.suggest.showKeywords": false
  },
  "[typescriptreact]": {
    "editor.suggest.showKeywords": false
  }
}

Learn more about configuring snippets in the VS Code IntelliSense documentation.

Known Issues

There are no known issues at this time, please reach out if you discover anything.