Emmet: μžλ™ 접두사λ₯Ό λΉ„ν™œμ„±ν™”ν•  수 μžˆμŠ΅λ‹ˆκΉŒ?

에 λ§Œλ“  2017λ…„ 04μ›” 23일  Β·  10μ½”λ©˜νŠΈ  Β·  좜처: emmetio/emmet

예λ₯Ό λ“€μ–΄ 'bxb'λ₯Ό μž…λ ₯ν•˜λ©΄

  -webkit-box-sizing: border-box
  -moz-box-sizing: border-box
  -ms-box-sizing: border-box
  box-sizing: border-box

κ·ΈλŸ¬λ‚˜ μ˜€λŠ˜λ‚  μš°λ¦¬λŠ” webpack이 그런 일을 ν•˜λ„λ‘ ν–ˆμŠ΅λ‹ˆλ‹€. μžλ™ 접두사λ₯Ό λ„λŠ” μŠ€μœ„μΉ˜κ°€ μžˆμŠ΅λ‹ˆκΉŒ?

κ°€μž₯ μœ μš©ν•œ λŒ“κΈ€

Sublime Textμ—μ„œ μžλ™ 접두사λ₯Ό μ œκ±°ν•˜λ €λ©΄ Preferences > Package Settings > Emmet > Settings-Userλ₯Ό ν΄λ¦­ν•˜κ³  λ‹€μŒ μŠ€λ‹ˆνŽ«μ„ μΆ”κ°€ν•˜μ‹­μ‹œμ˜€.

{
    "preferences": {
        "css.autoInsertVendorPrefixes": false
    },
}

λͺ¨λ“  10 λŒ“κΈ€

Visual Studio Codeλ₯Ό μ‚¬μš©ν•˜λŠ” 경우 settings.json(μ‚¬μš©μž λ˜λŠ” μž‘μ—… μ˜μ—­ μ„€μ •)에 섀정을 μΆ”κ°€ν–ˆμŠ΅λ‹ˆλ‹€.

{
    "emmet.preferences": {
        "css.autoInsertVendorPrefixes": false
    }
}

2017-06-02_18-05-47

css.autoInsertVendorPrefixes
ν™•μž₯된 CSS μ†μ„±μ˜ 곡급업체 접두사 볡사본을 μžλ™μœΌλ‘œ μƒμ„±ν•©λ‹ˆλ‹€. 기본적으둜 Emmet은 μ•½μ–΄(예: -bxsh) μ•žμ— λŒ€μ‹œλ₯Ό 넣을 λ•Œλ§Œ 곡급업체 접두사가 뢙은 속성을 μƒμ„±ν•©λ‹ˆλ‹€. 이 μ˜΅μ…˜μ„ μ‚¬μš©ν•˜λ©΄ μ•½μ–΄ μ•žμ— λŒ€μ‹œκ°€ ν•„μš”ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. Emmet은 곡급업체 접두사가 뢙은 속성을 μƒμ„±ν•©λ‹ˆλ‹€.

λ‹€λ₯Έ IDE λ˜λŠ” μ½”λ“œ νŽΈμ§‘κΈ°μ—μ„œλŠ” ν”„λ‘œμ νŠΈμ˜ 루트 디렉터리에 μ„€μ • 파일(preferences.json)을 λ§Œλ“€ 수 μžˆμŠ΅λ‹ˆλ‹€. λ§ν¬μ—μ„œ 더 λ§Žμ€ 정보λ₯Ό 찾을 수 μžˆμŠ΅λ‹ˆλ‹€ β€” https://docs.emmet.io/customization/preferences/

@albrin thx 많이!

@albrin , 말해봐, μ•„λ§ˆλ„ 접두사λ₯Ό λΉ„ν™œμ„±ν™”ν•˜λŠ” 방법을 μ•Œκ³  μžˆμ§€λ§Œ 이미 λŒ€κ΄„ν˜Έ μ•ˆμ— μžˆμŠ΅λ‹ˆκΉŒ?

Sublime Textμ—μ„œ μžλ™ 접두사λ₯Ό μ œκ±°ν•˜λ €λ©΄ Preferences > Package Settings > Emmet > Settings-Userλ₯Ό ν΄λ¦­ν•˜κ³  λ‹€μŒ μŠ€λ‹ˆνŽ«μ„ μΆ”κ°€ν•˜μ‹­μ‹œμ˜€.

{
    "preferences": {
        "css.autoInsertVendorPrefixes": false
    },
}

μ•ˆλ…•ν•˜μ„Έμš”, Sublime Text와 κ΄€λ ¨λœ μ΄μƒν•œ λ¬Έμ œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

μ‚¬μš©μž μ„€μ •μ—μ„œ λ³€κ²½ν–ˆμŠ΅λ‹ˆλ‹€

{
  "preferences": {
    "css.autoInsertVendorPrefixes": false
  }
}

그리고 그것은 μΌμ’…μ˜ μž‘λ™ν•©λ‹ˆλ‹€. d:f μž…λ ₯ν•˜λ©΄ 곡급업체 접두사가 μΆ”κ°€λ˜μ§€ μ•Šμ§€λ§Œ df ν•˜λ©΄ μΆ”κ°€λ©λ‹ˆλ‹€. 그것이 퍼지 검색과 관련이 μžˆλŠ”μ§€ λ˜λŠ” 무엇과 관련이 μžˆλŠ”μ§€ λͺ¨λ₯΄κ² μ§€λ§Œ λ„μ²­ν•˜λŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.
emmetvendorprefixes

Sublime Textμ—μ„œλ„ 같은 λ¬Έμ œκ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.

그것은 λ‚˜λ₯Ό μœ„ν•΄ 잘 μž‘λ™ν•©λ‹ˆλ‹€

{
    "preferences": {
        "css.autoInsertVendorPrefixes": false,
        "caniuse.enabled": false
    },
}

@KitCarver λ‚˜μ˜ μ˜μ›…!
ν˜Ήμ‹œ caniuse μ˜΅μ…˜μ΄ μ–΄λ””μ—μ„œ 온 것인지 μ•„μ‹­λ‹ˆκΉŒ?

예, μ—¬κΈ°μ—μ„œ μ°Ύμ•˜μŠ΅λ‹ˆλ‹€: https://docs.emmet.io/customization/preferences/

caniuse.ν™œμ„±ν™”
Can I Use λ°μ΄ν„°λ² μ΄μŠ€ 지원을 ν™œμ„±ν™”ν•©λ‹ˆλ‹€. ν™œμ„±ν™”λ˜λ©΄ CSS μ•½μ–΄ ν•΄μ„κΈ°λŠ” ν•΄μ„λ˜μ–΄μ•Ό ν•˜λŠ” CSS 속성을 κ°μ§€ν•˜κΈ° 전에 λ¨Όμ € λ°μ΄ν„°λ² μ΄μŠ€λ₯Ό μ‚¬μš©ν•  수 μžˆλŠ”μ§€ ν™•μΈν•©λ‹ˆλ‹€.

μžλ™ μ ‘λ‘μ‚¬λŠ” Emmet v2μ—μ„œ μ œκ±°λ©λ‹ˆλ‹€.

IntelliJ μ‚¬μš©μžμ˜ 경우 λ‹€μŒμ—μ„œ Auto insert css vendor prefixes λΉ„ν™œμ„±ν™”ν•˜μ‹­μ‹œμ˜€.

Preferences > Editor > Emmet > CSS

image

이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰

κ΄€λ ¨ 문제

renatorib picture renatorib  Β·  26μ½”λ©˜νŠΈ

DanielRuf picture DanielRuf  Β·  5μ½”λ©˜νŠΈ

fversepuy picture fversepuy  Β·  5μ½”λ©˜νŠΈ

planetoftheweb picture planetoftheweb  Β·  3μ½”λ©˜νŠΈ

sergeche picture sergeche  Β·  25μ½”λ©˜νŠΈ