184 lines
3.1 KiB
Plaintext
184 lines
3.1 KiB
Plaintext
snippet todo "// TODO"
|
|
// TODO $0
|
|
endsnippet
|
|
|
|
snippet fn "function .."
|
|
function $1($2) {
|
|
$0
|
|
}
|
|
endsnippet
|
|
|
|
snippet if "if ( ... ) { ... }"
|
|
if ($1) {
|
|
$0
|
|
}
|
|
endsnippet
|
|
|
|
snippet cl "console.log( ... )"
|
|
console.log($0);
|
|
endsnippet
|
|
|
|
snippet cw "console.warn( ... )"
|
|
console.warn($0);
|
|
endsnippet
|
|
|
|
snippet f "for (...)"
|
|
for (let index=0; index < $1; index += 1) {
|
|
$0
|
|
}
|
|
endsnippet
|
|
|
|
snippet fr "for (...)"
|
|
for (let index=${1:0}; index ${2:<} $3; index ${4:+=} ${5:1}) {
|
|
$0
|
|
}
|
|
endsnippet
|
|
|
|
snippet .fe "...forEach( ... );" i
|
|
.forEach(($1) => {
|
|
$0
|
|
});
|
|
endsnippet
|
|
|
|
snippet wae "window.addEventListener( ... );"
|
|
window.addEventListener('$1', ($2) => {
|
|
$0
|
|
});
|
|
endsnippet
|
|
|
|
snippet .ael "...addEventListener( ... );" i
|
|
.addEventListener('$1', ($2) => {
|
|
$0
|
|
});
|
|
endsnippet
|
|
|
|
snippet st "setTimeout( ... )"
|
|
setTimeout(() => {$0
|
|
}, ${1:1000});
|
|
endsnippet
|
|
|
|
snippet dq "document.querySelector( ... )"
|
|
document.querySelector($0)
|
|
endsnippet
|
|
|
|
snippet dqa "document.querySelectorAll( ... )"
|
|
document.querySelectorAll($0)
|
|
endsnippet
|
|
|
|
snippet cdq "const ... = document.querySelector( ... )"
|
|
const $1 = document.querySelector($0);
|
|
endsnippet
|
|
|
|
snippet cdqa "const ... = document.querySelectorAll( ... )"
|
|
const $1 = document.querySelectorAll($0);
|
|
endsnippet
|
|
|
|
snippet jsx "import React ..."
|
|
import * as React from "react";${1:
|
|
import { css } from "@emotion/react";}
|
|
|
|
const `!p snip.rv = snip.basename` = ($2) => {
|
|
return (
|
|
<div>$0
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default `!p snip.rv = snip.basename`;
|
|
endsnippet
|
|
|
|
|
|
snippet isi "import { StaticImage } ..."
|
|
import { StaticImage } from "gatsby-plugin-image";
|
|
endsnippet
|
|
|
|
snippet simg "<StaticImage ... />"
|
|
<StaticImage src="$1" alt="$2" />$0
|
|
endsnippet
|
|
|
|
snippet st. "styled."
|
|
const $1 = styled.${2:div}\`
|
|
$0
|
|
\`;
|
|
endsnippet
|
|
|
|
snippet icss "import ... from ..."
|
|
import \{ css \} from "@emotion/react";
|
|
endsnippet
|
|
|
|
snippet ccs "const ..Css=css``"
|
|
const $1Css = css\`
|
|
$0
|
|
\`;
|
|
endsnippet
|
|
|
|
snippet cse "css={css``}"
|
|
css={css\`$0\`}
|
|
endsnippet
|
|
|
|
snippet css "css={..Css}"
|
|
css={$0Css}
|
|
endsnippet
|
|
|
|
snippet th "this.handle..."
|
|
this.handle${1:Click} = this.handle$1.bind(this);
|
|
endsnippet
|
|
|
|
snippet tb "this ... = ... .bind(this);"
|
|
this.$1 = this.$1.bind(this);
|
|
endsnippet
|
|
|
|
snippet wprb
|
|
import { registerBlockType } from '@wordpress/blocks';
|
|
|
|
const blockStyle = {
|
|
color: red,
|
|
backgroundColor: pink,
|
|
};
|
|
|
|
registerBlockType( '${1:namespace}/${2:block-name}', {
|
|
title: '$3',
|
|
icon: '${4:universal-access-alt}',
|
|
category: '${5:layout}',
|
|
example: {},
|
|
edit( { className } ) {
|
|
return <div className={ className }>Hello World, step 1 (from the editor).</div>;
|
|
},
|
|
save() {
|
|
return <div style={ blockStyle }>Hello World, step 1 (from the frontend).</div>;
|
|
},
|
|
} );
|
|
endsnippet
|
|
|
|
snippet rtw "React + twin.macro"
|
|
import * as React from "react"
|
|
import 'twin.macro'
|
|
|
|
const `!p snip.rv = snip.basename` = ({ children }) => {
|
|
return (
|
|
<$1 tw="$0">
|
|
{children}
|
|
</$1>
|
|
)
|
|
}
|
|
|
|
export default `!p snip.rv = snip.basename`
|
|
|
|
endsnippet
|
|
|
|
snippet ue "useEffect(() => {"
|
|
useEffect(() => {
|
|
$0
|
|
}, ${1:[]});
|
|
endsnippet
|
|
|
|
snippet ule "useLayoutEffect(() => {"
|
|
useLayoutEffect(() => {
|
|
$0
|
|
}, ${1:[]});
|
|
endsnippet
|
|
|
|
snippet imp "import ... from ..."
|
|
import $1 from "${2:.}/$1";
|
|
endsnippet
|