Ace: [JavaScript Linting] ESNext 지원(async/await, 클래슀 속성 λ“±)

에 λ§Œλ“  2016λ…„ 12μ›” 06일  Β·  11μ½”λ©˜νŠΈ  Β·  좜처: ajaxorg/ace

ES6+ κΈ°λŠ₯을 더 잘 μ§€μ›ν•˜κΈ° μœ„ν•΄ ESLintλ₯Ό μ‚¬μš©ν•˜λ„λ‘ javascript 힌트λ₯Ό λ³€κ²½ν•˜λŠ” 것이 μ’‹μŠ΅λ‹ˆλ‹€.

클래슀 속성을 μ‚¬μš©ν•˜κ³  async/awaitλ₯Ό κ°€μž₯ 많이 μ‚¬μš©ν•  수 있기λ₯Ό μ›ν•˜μ§€λ§Œ jshint보닀 훨씬 더 λ‚˜μ€ λ‹€λ₯Έ 린트 κ·œμΉ™λ„ 많이 μžˆμŠ΅λ‹ˆλ‹€.

class Foo {
    bar = 'baz';
}
async function foo () {
    const bar = await baz();
}

μžλ°”μŠ€ν¬λ¦½νŠΈ λ¦°ν„°λ₯Ό κ΅μ²΄ν•˜λŠ” 것이 μ–Όλ§ˆλ‚˜ μ–΄λ €μš΄μ§€ μ‚΄νŽ΄λ³΄μ§€ μ•Šμ•˜κΈ° λ•Œλ¬Έμ— 이것이 μ–Όλ§ˆλ‚˜ ν˜„μ‹€μ μΈ μš”μ²­μΈμ§€ λͺ¨λ₯΄κ² μŠ΅λ‹ˆλ‹€.

linters

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

이 λ¬Έμ œμ— λŒ€ν•΄ μž‘μ—…ν•˜μ‹­μ‹œμ˜€.

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

이것은 쒋은 생각이며 #3180에도 ν•„μš”ν•©λ‹ˆλ‹€.
ESLint용 μ›Ή 데λͺ¨ 파일 을 기반으둜 ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

이 λ¬Έμ œμ— λŒ€ν•΄ μž‘μ—…ν•˜μ‹­μ‹œμ˜€.

μƒˆλ‘œμš΄ κΈ°λŠ₯을 μ§€μ›ν•˜λŠ” μƒˆλ‘œμš΄ JSHint 버전 2.10.0 이 μΆœμ‹œλ˜μ—ˆμŠ΅λ‹ˆλ‹€.

μž„μ‹œ ν•΄κ²° λ°©λ²•μœΌλ‘œ - ACE typescriptλ₯Ό μ‚¬μš©ν–ˆλŠ”λ° 이미 await/asyncκ°€ μžˆμŠ΅λ‹ˆλ‹€.

TypescriptλŠ” 였λ₯˜λ₯Ό ν‘œμ‹œν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. κ·ΈλŸ¬λ‚˜ λ‹€λ₯Έ λ§Žμ€ 였λ₯˜λ₯Ό λ†“μΉ©λ‹ˆλ‹€.

8**2 와 같은 μƒˆλ‘œμš΄ μˆ˜ν•™ μ—°μ‚°μžλ₯Ό ν¬ν•¨ν•˜μ—¬ λͺ¨λ“  es6 ꡬ문을 async/awaitν•˜λŠ” 것이 μ•„λ‹™λ‹ˆλ‹€.

였늘 ν˜„μž¬ 이 λ¬Έμ œλŠ” 3λ…„ 이 λ˜μ—ˆμŠ΅λ‹ˆλ‹€. Reactκ°€ μΆœμ‹œλœ 지 μ–Όλ§ˆ λ˜μ§€ μ•Šμ•„ 이에 λŒ€ν•œ μˆ˜μš”κ°€ μ¦κ°€ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€. 이 ν”„λ‘œμ νŠΈλŠ” μ—¬μ „νžˆ 맀우 ν™œλ°œν•˜μ§€λ§Œ 곡식적인 λ‘œλ“œλ§΅μ— 이것이 μžˆλ‹€λŠ” ν‘œμ‹œλŠ” μ—†μœΌλ©° "그래, 그게 μš°λ¦¬κ°€ ν•΄μ•Ό ν•  일이고 μ•„λ§ˆλ„ κ·Έλ ‡κ²Œ ν•  것"인 κ²ƒμ²˜λŸΌ λ³΄μž…λ‹ˆλ‹€.

μ—¬κΈ°μ—μ„œ μΌμ’…μ˜ μ—…λ°μ΄νŠΈλ₯Ό _제발_ 받을 수 μžˆμŠ΅λ‹ˆκΉŒ? @λ‚˜μž‡μœ™ ? @adamjimenez ?

CSS 파일용 λ¦°ν„°λ₯Ό 찾으렀고 ν•˜λ˜ 쀑 이것을 μ°Ύμ•˜κ³ , λ°°μ‹¬μ›λ‹¨μ—μ„œ λ‚΄ μžμ‹ μ˜ 것을 __/mode/javascript_worker.js_ πŸ”—

이 ꡬ성은 적어도 μžλ°”μŠ€ν¬λ¦½νŠΈ μž‘μ—…μž λͺ¨λ“œμ—μ„œ μž‘μ—…ν•  λ•Œ ESNext 지원을 μœ„ν•΄ 이미 μ„€μ •λ˜μ—ˆμŒμ„ μ‹œμ‚¬ν•˜λŠ” 것 κ°™μŠ΅λ‹ˆλ‹€. 개인적으둜 이것은 빛을 λ°œμ‚°ν•˜μ§€ μ•Šμ•˜μ§€λ§Œ μ•„λ§ˆλ„ 이것은 μ—¬λŸ¬λΆ„ 쀑 ν•˜λ‚˜λ₯Ό λ„μšΈ 수 μžˆμŠ΅λ‹ˆλ‹€

jshint.js νŒŒμΌμ„ μ΅œμ‹  파일둜 ꡐ체 ν›„ ace μž¬λΉŒλ“œλ₯Ό ν•΄λ³΄μ•˜μŠ΅λ‹ˆλ‹€. μ΄λ ‡κ²Œ ν•˜λ©΄ async/await에 λŒ€ν•΄ 였λ₯˜κ°€ ν‘œμ‹œλ˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. κ·ΈλŸ¬λ‚˜ λ‹€λ₯Έ μ‹œλ‚˜λ¦¬μ˜€(λŒ€κ΄„ν˜Έ λˆ„λ½, λ‹«νžˆμ§€ μ•Šμ€ λ¬Έμžμ—΄ λ“±)에 λŒ€ν•œ 였λ₯˜ ν‘œμ‹œλ„ μ€‘μ§€ν•©λ‹ˆλ‹€. 맀우 μ‹€λ§μŠ€λŸ½μŠ΅λ‹ˆλ‹€. μ—μ΄μŠ€ ν”„λ‘œμ νŠΈκ°€ μ’…λ£Œλœ 것 κ°™μŠ΅λ‹ˆλ‹€.

λ‚˜λ„ μ΄κ²ƒμœΌλ‘œ λ§Œμ§€μž‘κ±°λ¦¬κ³  μžˆμ—ˆκ³  λ‚˜λŠ” 그것을 μž‘λ™μ‹œν‚¬ 수 μžˆμ—ˆλ‹€. λ¬Έμ„œλ₯Ό μ—…λ°μ΄νŠΈν•  수 μžˆμ—ˆμ§€λ§Œ 전체 μƒνƒœκ³„κ°€ μ–΄λ–»κ²Œ μž‘λ™ν•˜λŠ”μ§€ μ•Œμ•„λ‚΄λŠ” 것은 λ‹€μ†Œ κ³ ν†΅μŠ€λŸ¬μ› μŠ΅λ‹ˆλ‹€(λͺ‡ μ‹œκ°„ μ†Œμš”). 그런 λ‹€μŒ λͺ¨λ“  변경이 ν•œ 쀄에 ν•„μš”ν•˜λ‹€λŠ” 것을 λ°°μ› μŠ΅λ‹ˆλ‹€... :/

λͺ‡ 가지 μ˜΅μ…˜μ΄ μžˆμŠ΅λ‹ˆλ‹€.
1) νŒ¨ν‚€μ§€/μΆ•μ†Œ 버전을 방금 κ°€μ Έμ˜¨ 경우 - "esnext:!0"을 "esversion:9"둜 λ°”κΏ”μ•Ό ν•©λ‹ˆλ‹€.
https://raw.githubusercontent.com/ajaxorg/ace-builds/master/src-min/worker-javascript.js
2) repoλ₯Ό ν™•μΈν•˜κ³  직접 λΉŒλ“œν•  수 μžˆμŠ΅λ‹ˆλ‹€. (μ•½ 1λΆ„ 정도 μ†Œμš”λ˜λ―€λ‘œ 이것도 λ‹€μ†Œ μ‰½μŠ΅λ‹ˆλ‹€)

git clone [email protected]:ajaxorg/ace.git
npm install
nano +82 lib/ace/mode/javascript_worker.js // replace "esnext: true," with "esversion: 9"
node Makefile.dryice.js full --target ../ace-builds

μ—…λ°μ΄νŠΈ : λ‚΄ λ§ˆμ§€λ§‰ 의견이 λ‹€λ₯Έ 방법을 찾은 이후 :

var editor = ace.edit("editor");
editor.session.on('changeMode', function(e, session){
    if ("ace/mode/javascript" === session.getMode().$id) {
        if (!!session.$worker) {
            session.$worker.send("setOptions", [{
                "esversion": 9,
                "esnext": false,
            }]);
        }
    }
});
editor.session.setMode("ace/mode/javascript");

μ—„μ²­λ‚œ!! ES6의 경우 6 λ“±κ³Ό 같은 λ‹€λ₯Έ 버전을 지정할 수 μžˆλŠ”μ§€ 여뢀에 λŒ€ν•œ ν‘œμ‹œκ°€ μžˆμŠ΅λ‹ˆκΉŒ?

λ‹€λ₯Έ μ‚¬λžŒλ“€μ΄ git을 처음 μ‚¬μš©ν•˜κ±°λ‚˜ Githubμ—μ„œ SSHλ₯Ό μ„€μ •ν•˜μ§€ μ•Šμ€ 경우 git clone https://github.com/ajaxorg/ace.git/ 둜 λ³΅μ œν•  μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€. _λ‚΄κ°€ μΈμ •ν•˜κ³  싢은 것보닀 ν•œ 번 더 λΉ„ν‹€κ±°λ Έλ‹€_

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