Material-ui: [рдЬреЗрдПрд╕рдПрд╕] рдЫрджреНрдо рддрддреНрд╡ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣реЗ рд╣реИрдВ

рдХреЛ рдирд┐рд░реНрдорд┐рдд 13 рдЬреВрди 2018  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: mui-org/material-ui

  • [x] рдпрд╣ рдПрдХ v1.x рдореБрджреНрджрд╛ рд╣реИ (v0.x рдЕрдм рдЕрдиреБрд░рдХреНрд╖рд┐рдд рдирд╣реАрдВ рд╣реИ)ред
  • [x] рдореИрдВрдиреЗ рдЗрд╕ рднрдВрдбрд╛рд░ рдХреЗ рдореБрджреНрджреЛрдВ рдХреА рдЦреЛрдЬ рдХреА рд╣реИ рдФрд░ рдореБрдЭреЗ рд╡рд┐рд╢реНрд╡рд╛рд╕ рд╣реИ рдХрд┐ рдпрд╣ рдбреБрдкреНрд▓рд┐рдХреЗрдЯ рдирд╣реАрдВ рд╣реИред

рдЕрдкреЗрдХреНрд╖рд┐рддреН рд╡реНрдпрд╡рд╣рд╛рд░


рдЫрджреНрдо рддрддреНрд╡ ( ::before рдФрд░ ::after ) рдХрд╛рдо рдХрд░ рд░рд╣реЗ рд╣реИрдВред

рд╡рд░реНрддрдорд╛рди рд╡реНрдпрд╡рд╣рд╛рд░


рдЫрджреНрдо рддрддреНрд╡ ( ::before рдФрд░ ::after ) рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣реЗ рд╣реИрдВред

рдкреБрдирд░реБрддреНрдкрд╛рджрди рдХреЗ рд▓рд┐рдП рдХрджрдо (рдмрдЧ рдХреЗ рд▓рд┐рдП)

  1. https://codesandbox.io/s/x2yv65109q
  2. ::before рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ Button рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рджрд┐рдЦрд╛рдИ рдирд╣реАрдВ рджреЗ рд░рд╣реЗ рд╣реИрдВ (рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐ рджреЗрд╡ рдЙрдкрдХрд░рдг рдореЗрдВ рднреА)

рд╕рдВрджрд░реНрдн


рдзреНрдпрд╛рди рджреЗрдВ, рд╡рд╣ рдХрд╕реНрдЯрдо JssProvider рдХреЙрдиреНрдлрд╝рд┐рдЧрд░ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ - рдореИрдВ рдХреЗрд╡рд▓ @material-ui/core рд╕реЗ рдПрдХрд▓ рдШрдЯрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рд▓реЗрдХрд┐рди рдореЗрд░рд╛ рдорд╛рдирдирд╛ тАЛтАЛрд╣реИ рдХрд┐ рдЬреЗрдПрд╕рдПрд╕ рдкреНрд▓рдЧрдЗрдиреНрд╕ рдХреЛ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдореБрдЭреЗ JssProvider рдХреЛ рдХреЙрдиреНрдлрд╝рд┐рдЧрд░ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред

рд╕рд╛рде рд╣реА, рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЕрдиреНрдп рдЫрджреНрдо рдЪрдпрдирдХрд░реНрддрд╛ рднреА рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣реЗ рд╣реИрдВред

рдХреНрдпрд╛ рдореБрдЭрд╕реЗ рдХреБрдЫ рдЧрд▓рдд рд╣реЛ рд░рд╣реА рд╣реИ?

рдЖрдкрдХрд╛ рдкрд░реНрдпрд╛рд╡рд░рдг

| рдЯреЗрдХ | рд╕рдВрд╕реНрдХрд░рдг |
|--------------|------------|
| рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ | v1.2.1 |
| рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ | 16.3.2 |
| рдмреНрд░рд╛рдЙрдЬрд╝рд░ | рдХреНрд░реЛрдо |
| рдЖрджрд┐ | |

external dependency support

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

  button: {
    "&::before": {
-     content: "before"
+     content: "'before'"
    }
  }

рд╕рднреА 6 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

  button: {
    "&::before": {
-     content: "before"
+     content: "'before'"
    }
  }

рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!

рд╣рдо рд╕рдорд╕реНрдпрд╛ рдЯреНрд░реИрдХрд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рдмрдЧ рд░рд┐рдкреЛрд░реНрдЯ рдФрд░ рд╕реБрд╡рд┐рдзрд╛ рдЕрдиреБрд░реЛрдзреЛрдВ рдХреЗ рд▓рд┐рдП рдХрд░рддреЗ рд╣реИрдВ, рд╣рд╛рд▓рд╛рдВрдХрд┐,
рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдПрдХ рд╕рдорд░реНрдерди рдЕрдиреБрд░реЛрдз рдпрд╛ рдкреНрд░рд╢реНрди рдкреНрд░рддреАрдд рд╣реЛрддреА рд╣реИред рдХреГрдкрдпрд╛ StackOverflow рдкрд░ рдкреВрдЫреЗрдВ рдХрд┐ рдХрд╣рд╛рдБ
рд╕рдореБрджрд╛рдп рдорджрдж рдХрд░рдиреЗ рдХреА рдкреВрд░реА рдХреЛрд╢рд┐рд╢ рдХрд░реЗрдЧрд╛ред рдПрдХ "material-ui" рдЯреИрдЧ рд╣реИ рдЬрд┐рд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдЖрдк рдЕрдкрдиреЗ . рдХреЛ рдЯреИрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ
рдкреНрд░рд╢реНрдиред

рдпрджрд┐ рдЖрдк рдпрд╣рд╛рдВ рд╕реЗ SO рдкрд░ рдЕрдкрдиреЗ рдкреНрд░рд╢реНрди рд╕реЗ рд▓рд┐рдВрдХ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рддреЛ рдпрд╣ рджреВрд╕рд░реЛрдВ рдХреЛ рдЗрд╕реЗ рдЦреЛрдЬрдиреЗ рдореЗрдВ рдорджрдж рдХрд░реЗрдЧрд╛ред
рдпрджрд┐ рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛рдУрдВ рдХреА рдкреБрд╖реНрдЯрд┐ рдмрдЧ рдХреЗ рд░реВрдк рдореЗрдВ рдХреА рдЬрд╛рддреА рд╣реИ, рддреЛ рд╕рдорд╕реНрдпрд╛ рдЯреЗрдореНрдкрд▓реЗрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдлрд┐рд░ рд╕реЗ рдЦреЛрд▓рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрдкрдХрд╛ рд╕реНрд╡рд╛рдЧрдд рд╣реИред

@oliviertassinari рдзрдиреНрдпрд╡рд╛рдж! рдРрд╕реЗ рдореВрд░реНрдЦрддрд╛рдкреВрд░реНрдг рдкреНрд░рд╢реНрди рдХреЗ рд▓рд┐рдП рдХреНрд╖рдорд╛ рдХрд░реЗрдВ

рдХреНрдпрд╛ рд╣реЛрдЧрд╛ рдпрджрд┐ рд╣рдо рд╕рд╛рдордЧреНрд░реА рдХреЗ рд▓рд┐рдП рд╕реНрдерд╛рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ? рд╕рд╛рдорд╛рдиреНрдп рд╕реАрдПрд╕рдПрд╕ рдореЗрдВ '' рдпрд╛ ' ' рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рд▓реЗрдХрд┐рди рдЬреЗрдПрд╕рдПрд╕ рдХреЗ рд╕рд╛рде рдирд╣реАрдВ?

рдпрд╣рд╛рдБ @oliviertassinari рдЯрд┐рдкреНрдкрдгреА рдХреЗ рдЕрдиреБрд╕рд╛рд░ рдЗрд╕реЗ рдХрднреА рднреА рд╣рд▓ рди рдХрд░реЗрдВ https://github.com/cssinjs/jss/issues/242#issuecomment -261735197

  button: {
    "&::before": {
-     content: "before"
+     content: "'before'"
    }
  }

@oliviertassinari XD

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

sys13 picture sys13  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

revskill10 picture revskill10  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

chris-hinds picture chris-hinds  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

FranBran picture FranBran  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

anthony-dandrea picture anthony-dandrea  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ