Advertisement
Guest User

Untitled

a guest
Jul 22nd, 2019
96
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.06 KB | None | 0 0
  1. @s3rious вспомнил про лайв темплейты :trollface:
  2.  
  3. *JS*
  4.  
  5. `>>` - `($START$) => {$END$}`<br />
  6. `cs` - `console.log($END$)`<br />
  7. `ce` - `console.error($END$)`<br />
  8. `rcs` - `return console.log($END$)`<br />
  9. `fn` - `function ($START$) {$END$}`<br />
  10. `im` - `import $START$ from '$END'`
  11.  
  12. *React*
  13.  
  14. `cnst` -
  15. ```
  16. constructor() {
  17. super()
  18.  
  19. this.state = {
  20. $END$
  21. }
  22. }
  23. ```
  24.  
  25. `fcc` -
  26. ```
  27. import React, { Component } from 'react'
  28.  
  29. import cssModules from 'react-css-modules'
  30. import styles from './$COMPONENT$.scss'
  31.  
  32.  
  33. @cssModules(styles, { allowMultiple: true })
  34. export default class $COMPONENT$ extends Component {
  35.  
  36. render() {
  37.  
  38. return (
  39. $END$
  40. )
  41. }
  42. }
  43. ```
  44.  
  45. `lcc` -
  46. ```
  47. import React from 'react'
  48.  
  49. import cssModules from 'react-css-modules'
  50. import styles from './$COMPONENT$.scss'
  51.  
  52.  
  53. const $COMPONENT$ = () => (
  54. $END$
  55. )
  56.  
  57. export default cssModules($COMPONENT$, styles)
  58. ```
  59.  
  60. `cstp` - `const { $END$ } = this.props`<br />
  61. `csts` - `const { $END$ } = this.state`<br />
  62. `cstx` - `const { $END$ } = this.context`<br />
  63. `dc` - `<div className="$START$">$END$</div>`<br />
  64. `ds` - `<div styleName="$START$">$END$</div>`<br />
  65. `dsk` - `<div key={index} styleName="$START$">$END$</div>`<br />
  66. `imact` - `import actions from 'redux/actions'`<br />
  67. `imcon` - `import { connect } from 'redaction'`<br />
  68. `imcss` -
  69. ```
  70. import cssModules from 'react-css-modules'
  71. import styles from './$COMPONENT$.scss'$END$
  72. ```
  73. `imint` -
  74. ```
  75. import { FormattedMessage } from 'sb-react-intl'
  76. import messages from './messages'$END$
  77. ```
  78. `imh` - `import { $END$ } from 'helpers'`<br />
  79. `imp` - `import PropTypes from 'prop-types'`<br />
  80. `imred` - `import { reducers } from 'redux/core'`<br />
  81. `ss` -
  82. ```
  83. this.setState({
  84. $END$
  85. })
  86. ```
  87. `stp` -
  88. ```
  89. static propTypes = {
  90. $END$
  91. }
  92. ```
  93.  
  94. *SCSS*
  95.  
  96. `mdm` -
  97. ```
  98. @include media-mobile {
  99.  
  100.  
  101. }
  102.  
  103. @include media-except-mobile {
  104.  
  105.  
  106. }
  107. ```
  108.  
  109. `fc` -
  110. ```
  111. &:first-child {
  112. $END$
  113. }
  114. ```
  115.  
  116. `lc` -
  117. ```
  118. &:last-child {
  119. $END$
  120. }
  121. ```
  122.  
  123. `fo` -
  124. ```
  125. &:focus {
  126. $END$
  127. }
  128. ```
  129.  
  130. `ho` -
  131. ```
  132. &:hover {
  133. $END$
  134. }
  135. ```
  136.  
  137. `af` -
  138. ```
  139. &::after {
  140. $END$
  141. }
  142. ```
  143.  
  144. `bf` -
  145. ```
  146. &::before {
  147. $END$
  148. }
  149. ```
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement