Js-beautify: 속성을 쀄 λ°”κΏˆ ν•  λ•Œ 쀄이 μ˜¬λ°”λ₯΄κ²Œ λ“€μ—¬ μ“°κΈ°λ˜μ§€ μ•ŠμŒ

에 λ§Œλ“  2017λ…„ 01μ›” 05일  Β·  23μ½”λ©˜νŠΈ  Β·  좜처: beautify-web/js-beautify

기술

속성 쀄 λ°”κΏˆμ΄ λ°œμƒν•  λ•Œλ§ˆλ‹€ λ“€μ—¬ μ“°κΈ°κ°€ μ€‘λ‹¨λ©λ‹ˆλ‹€.

js-beautify v1.6.8 μ‚¬μš© .

μž…λ ₯

μ½”λ“œλŠ” λ―Έν™” 전에 λ‹€μŒκ³Ό 같이 λ³΄μ˜€μŠ΅λ‹ˆλ‹€.

<div first second>content</div>
<div>content</div>

μ˜ˆμƒ 좜λ ₯

μ½”λ“œλŠ” λ―Έν™” ν›„ λ‹€μŒκ³Ό κ°™μ•„μ•Όν•©λ‹ˆλ‹€.

<div first 
     second>content</div>
<div>content</div>

μ‹€μ œ 좜λ ₯

μ½”λ“œλŠ” μ‹€μ œλ‘œ λ―Έν™” ν›„ λ‹€μŒκ³Ό 같이 λ³΄μž…λ‹ˆλ‹€.

<div first
     second>content</div>
    <div>content</div>

μž¬ν˜„ 단계

μ½”λ“œλ₯Ό μ•„λ¦„λ‹΅κ²Œ

ν™˜κ²½

운영체제 : MacOS

μ„€μ •

예:

{
    "wrap_attributes": "force-aligned"
}

μ°Έκ³  : wrap_attributesλŠ” κ°•μ œ μ •λ ¬λ‘œ μ„€μ •ν•  ν•„μš”κ°€ μ—†μŠ΅λ‹ˆλ‹€. "μžλ™"으둜 인해 λž©ν•‘μ΄μ΄ 문제λ₯Ό λ‚˜νƒ€λ‚΄λŠ” 경우λ₯Ό ν¬ν•¨ν•˜μ—¬ λͺ¨λ“  λž©ν•‘ ( "force-expand-multiline"μ œμ™Έ)이 λ„μž…λ©λ‹ˆλ‹€.

html bug

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

문제λ₯Ό λ°œκ²¬ν–ˆμŠ΅λ‹ˆλ‹€. μ§€κΈˆ μˆ˜μ • μ€‘μž…λ‹ˆλ‹€.

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

λ™μΌν•œ λ¬Έμ œκ°€ λ°œμƒν•©λ‹ˆλ‹€ (atom-beautify # 735 λ₯Ό 톡해).

<p attr1 attr2 attr3>
  text
</p>

둜 λ³€ν•˜λ‹€

<p attr1
    attr2
    attr3>
  text
  </p>

λ‚΄ 포슀 랩이 켜져 μžˆμŠ΅λ‹ˆλ‹€

μ—¬κΈ°μ„œλ„ μ½”λ“œλŠ” λ§ˆμ§€λ§‰ μˆœκ°„κΉŒμ§€ 점점 더 λ“€μ—¬ μ“°κΈ°λ©λ‹ˆλ‹€. 이 λ―Έν™”λ₯Ό 더 이상 이와 같이 μ‚¬μš©ν•˜λŠ” 것은 λΆˆκ°€λŠ₯ν•©λ‹ˆλ‹€. μˆ˜λ™μœΌλ‘œ μ½”λ“œ ν˜•μ‹μ„ μ§€μ •ν•΄μ•Όν•©λ‹ˆλ‹€.

<nav id="header"
  class="navbar navbar-default">
  <div class="header-container container-fluid">
    <div class="logo-container navbar-header">
      <a ui-sref="stats"
        class="navbar-brand pws-icon pws-pws"></a>
    </div>
    <div class="header-contents collapse navbar-collapse">
      <ul class="tab-list nav navbar-nav">
        <li class="tab tab-prospects"
          ui-sref-active="active">
          <a ui-sref="stats">
            Stats
          </a>
          </li>
          <li class="tab tab-prospects"
            ui-sref-active="active">
            <a ui-sref="upload">
              Importer
            </a>
            </li>
            <li class="tab tab-prospects"
              ui-sref-active="active">
              <a ui-sref="territories">
                Territory Assignment
              </a>
              </li>

      </ul>
    </div>
  </div>
  </nav>

λ¬΄μž‘μœ„λ‘œ λ°œμƒν•˜κΈ° μ‹œμž‘ν•œμ΄ 버그λ₯Ό 확인할 수 μžˆμŠ΅λ‹ˆλ‹€.
νƒœκ·Έμ˜ 속성이 쀄 λ°”κΏˆ 될 λ•Œλ§ˆλ‹€ λ‚΄λΆ€ λ‚΄μš©μ΄ 잘λͺ» λ“€μ—¬ μ“°κΈ° μ‹œμž‘λ©λ‹ˆλ‹€.

[νŽΈμ§‘ν•˜λ‹€]
μˆ˜μ • 사항이 전달 될 λ•ŒκΉŒμ§€ λ‚΄ μž‘μ—…μ„ μž¬κ°œν•˜λ €λ©΄μ΄ ν”ŒλŸ¬κ·ΈμΈμ„ λΉ„ν™œμ„±ν™”ν•΄μ•Όν–ˆμŠ΅λ‹ˆλ‹€ = /

여기도 λ§ˆμ°¬κ°€μ§€μž…λ‹ˆλ‹€! = /

@bitwiseman 이 μž‘μ—…μ„ν•˜λŠ” μ‚¬λžŒμ΄ μžˆμŠ΅λ‹ˆκΉŒ? 이것은 κ½€ μΈκΈ°μžˆλŠ” νŒ¨ν‚€μ§€μ΄κ³  이것은 κ½€ 큰 λ¬Έμ œμž…λ‹ˆλ‹€ ... λ‚˜λŠ” 그것이 고쳐 쑌으면 μ’‹κ² μŠ΅λ‹ˆλ‹€. :( λΆˆν–‰νžˆλ„ μ½”λ“œλ₯Ό 직접 κΈ°μ—¬ν•˜κΈ° μœ„ν•΄ 무엇을 변경해야할지 λͺ¨λ₯΄κ² μŠ΅λ‹ˆλ‹€. μ•„λ§ˆλ„ 포인터가 μžˆμŠ΅λ‹ˆκΉŒ?

.jsbeautifyrc νŒŒμΌμ—μ„œ html "wrap_attributes": "force" 을 μ œκ±°ν•˜λ©΄ λ¬Έμ œκ°€ ν•΄κ²°λ˜λŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.

@chenasraf-이 λ¬Έμ œκ°€ ν•΄κ²° λ˜μ—ˆμœΌλ©΄ν•©λ‹ˆλ‹€ . 둜컬 λΉŒλ“œμ— λŒ€ν•œ 지침은 Contributing.md λ₯Ό μ°Έμ‘°ν•˜μ‹­μ‹œμ˜€.
Pull request # 1104λŠ” 쒋은 λ³€κ²½ 사항을 λ³΄μ—¬μ€λ‹ˆλ‹€ : test/data/html/tests.js 에 ν•­λͺ© μΆ”κ°€, μ œν’ˆ μ½”λ“œ μ—…λ°μ΄νŠΈ 및 λΉŒλ“œ ( generated νŒŒμΌμ— λŒ€ν•œ 변경은 μžλ™μœΌλ‘œ μˆ˜ν–‰λ¨).

@matheusdavidson- μ•Œμ•„λ‘λ©΄ μ’‹μŠ΅λ‹ˆλ‹€. @chenasraf- 이미 wrap_attributes μ˜΅μ…˜μ„ ν…ŒμŠ€νŠΈν•˜λŠ” 행렬에 ν…ŒμŠ€νŠΈλ₯Ό μΆ”κ°€ν•˜κ³  싢을 κ²ƒμž…λ‹ˆλ‹€.

μ‹€μ œλ‘œμ΄ μž‘μ—…μ„ν•˜λŠ” μ‚¬λžŒμ΄ μžˆμŠ΅λ‹ˆκΉŒ? λͺ¨λ‘ ν™•μΈν•˜κΈ°μ—λŠ” λ„ˆλ¬΄ λ§Žμ€ 포크가 μžˆμŠ΅λ‹ˆλ‹€. λ‚΄κ°€ λ„μšΈ 수 μžˆμ„μ§€λ„ λͺ°λΌ.

@ kf-ireneuszpatalas μž‘μ—… ν•  μ‹œκ°„μ΄ μ—†μ—ˆκ³  @chenasraf 만이 관심을 ν‘œλͺ… ν•œ μœ μΌν•œ μ‚¬λžŒμž…λ‹ˆλ‹€.

@bitwiseman js / lib / beautify-html.js : 980 뒀에 multi_parser.unindent() λ₯Ό μΆ”κ°€ν•˜λ©΄μ΄ λ¬Έμ œκ°€ ν•΄κ²°λ˜λŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.ν•˜μ§€λ§Œ 이것이 λ…Όλ¦¬μ μœΌλ‘œ μ ν•©ν•œ 지, μΆ”κ°€ ν•  쑰건 등은 ν™•μ‹€ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. κ·Έλž˜λ„ λ‚΄κ°€ μ²˜λ¦¬ν•˜κΈ°λ₯Ό μ›ν•œλ‹€λ©΄ νŒ¨ν‚€μ§€μ—μ„œ μ§„ν–‰λ˜λŠ” κΈ°λ³Έ 사항을 μ‚΄νŽ΄λ³Ό μΆ©λΆ„ν•œ 자유 μ‹œκ°„μ„ 얻을 λ•ŒκΉŒμ§€ 며칠이 걸릴 κ²ƒμž…λ‹ˆλ‹€. μ•„λ‹ˆλ©΄ λ‹€λ₯Έ μ‚¬λžŒμ΄ 고삐λ₯Ό 작고 μ‹Άμ–΄

@chenasraf- λ‹€λ₯Έ μž‘μ—…μ„ μˆ˜ν–‰ν•˜κΈ° 전에 μ—¬λŸ¬ ν…ŒμŠ€νŠΈκ°€ μ‹€νŒ¨ν•©λ‹ˆλ‹€. 예, κ°€λŠ₯ν•˜λ©΄μ΄ 문제λ₯Ό ν•΄κ²°ν•΄ μ£Όμ‹œκΈ° λ°”λžλ‹ˆλ‹€.

@chenasraf , @bitwiseman. 내일 λ³Ό μ‹œκ°„μ΄ μžˆμŠ΅λ‹ˆλ‹€.

문제λ₯Ό λ°œκ²¬ν–ˆμŠ΅λ‹ˆλ‹€. μ§€κΈˆ μˆ˜μ • μ€‘μž…λ‹ˆλ‹€.

PR 제좜

@HookyQR- κ°μ‚¬ν•©λ‹ˆλ‹€! 병합 및 κ²Œμ‹œλ˜μ—ˆμŠ΅λ‹ˆλ‹€.

"μžλ™ μ •λ ¬"둜 λž˜ν•‘ μ˜΅μ…˜μ„ ν™•μž₯ ν•  수 μžˆμŠ΅λ‹ˆκΉŒ?

"force-align"은 κ°•μ œ λž˜ν•‘ + μ •λ ¬ ...

ν•˜μ§€λ§Œ λͺ¨λ“  단일 HTML μš”μ†Œλ₯Ό λž˜ν•‘ν•˜μ§€ μ•Šκ³  κΈ΄ μš”μ†Œ 만 λž˜ν•‘ν•˜κ³  싢지 μ•Šλ‹€κ³  κ°€μ • ν•΄ λ³΄κ² μŠ΅λ‹ˆλ‹€. 그런 λ‹€μŒ μˆ˜λ™μœΌλ‘œ ..

λ”°λΌμ„œ "auto-align"은 이미 λž˜ν•‘ 된 ν•­λͺ© 만 μ •λ ¬ν•©λ‹ˆλ‹€.

@Montago- μž…λ ₯, 좜λ ₯ λ“± μ›ν•˜λŠ” λ‚΄μš©μ„ μ„€λͺ…ν•˜λŠ” μƒˆ 문제λ₯Όμ—¬μ„Έμš”.

λΏ‘ 빡뀨

λ‚΄κ°€ μ›ν•˜λŠ” κΈ°λŠ₯이 이미 μ—΄λ € μžˆμŠ΅λ‹ˆλ‹€ : https://github.com/beautify-web/js-beautify/issues/1125

방금 μ„€μΉ˜ν–ˆλŠ”λ° grunt 및 λ‹€μŒ μ˜΅μ…˜κ³Ό ν•¨κ»˜ λ“€μ—¬ μ“°κΈ° λ¬Έμ œκ°€ λ°œμƒν•©λ‹ˆλ‹€. wrapAttributes: 'force-expand-multiline'
v1.7.5λ₯Ό μ‹€ν–‰ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€.
감사

'force-expand-multiline' μ—…λ°μ΄νŠΈμ—μ„œλ„μ΄ λ¬Έμ œκ°€ λ°œμƒν•©λ‹ˆκΉŒ?

'force-expand-multiline'μ—μ„œλ„μ΄ λ¬Έμ œκ°€ λ°œμƒν•©λ‹ˆλ‹€.

νŠΈμœ— λ‹΄μ•„ κ°€κΈ°
1.8.0-rc2둜 이것을 μ‹œλ„ ν–ˆμŠ΅λ‹ˆκΉŒ?

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