
Loki Snippets for VS Code.
Loki is composed of a common snippets to use in React ecosystem.
Installation
- Open Extensions sidebar panel in VS Code.
View > Extensions
- Search for
Loki Snippets
- Click Install to install it
To use it, just type snippet and press Enter, when the snippet contains parameters just fill and navigate on next using Tab.
EXAMPLES
We have several snippets and we'll be adding new ones over time, here's the list:
React
ir: import React from 'react'
rc: Component
import React from 'react'
export const Snippets = () => {
return <div></div>
}
rfc: Function component
import React from 'react'
export function Snippets() {
return <div></div>
}
rcp: Component with props
import React from 'react'
type SnippetsProps = {
}
export const Snippets = (_: SnippetsProps) => {
return <div></div>
}
export default Snippets
rfcp: Function component with props
import React from 'react'
type SnippetsProps = {
foo: string
bar: number
}
export const Snippets = (_: SnippetsProps) => {
return <div></div>
}
export default Snippets
React Testing Library
irtl: import { cleanup, render } from '@testing-library/react'
rtld: describe
import { cleanup, render } from '@testing-library/react'
describe('Snippets', () => {
afterEach(cleanup)
it('should render correctly', () => {
const { container } = render(<Snippets />)
expect(container).toBeInTheDocument()
})
})
rtli: it
it('should render correctly', () => {
const { container } = render(<Snippets />)
expect(container).toBeInTheDocument()
})
rtlie: it.each
const cases = [{ disabled: true, name: 'Snippets' }, { className: 'p-4' }]
it.each(cases)('should render correctly with props', props => {
const { container } = render(<Snippets {...props} />)
expect(container).toBeInTheDocument()
})
Typescript
tsa: Arrow function
const snippets = () => {
return
}
tsf: Function
function snippets() {
return
}
tst: Type
type Snippets = {
}
tsi: Interface
interface Snippets {
}
Loki Snippets created by Melquisedec Felipe.