Vscode-theme-onedark: VSCode 1.9의 μƒˆλ‘œμš΄ λ²”μœ„ 지정 ν…Œλ§ˆ μˆ˜μ •

에 λ§Œλ“  2017λ…„ 02μ›” 03일  Β·  17μ½”λ©˜νŠΈ  Β·  좜처: akamud/vscode-theme-onedark

VSCode 1.9λŠ” 색상 지정을 μœ„ν•΄ tmTheme λ²”μœ„λ₯Ό μ²˜λ¦¬ν•˜λŠ” 방식을 μ™„μ „νžˆ λ³€κ²½ν–ˆμŠ΅λ‹ˆλ‹€.

전체 ν…Œλ§ˆκ°€ ν˜„μž¬ μ†μƒλ˜μ–΄ 거의 μ™„μ „νžˆ μ²˜μŒλΆ€ν„° λ‹€μ‹œ μˆ˜ν–‰ν•΄μ•Ό ν•©λ‹ˆλ‹€.

μΆ”κ°€ 정보: https://github.com/Microsoft/vscode/issues/18357

new-version-broken

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

κΈ°λ‹€λ¦¬μ‹œλŠ” 뢄듀을 μœ„ν•΄ 1.1.0 버전이 1.9 이전 버전과 λ™μΌν•œ 색상을 가지고 μžˆλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. VSCode Marketplaceμ—μ„œ μ—…λ°μ΄νŠΈν•˜λ©΄ λ©λ‹ˆλ‹€.

Ruby 및 JS/TS와 같은 일뢀 μ–Έμ–΄λŠ” μƒˆλ‘œμš΄ λ²”μœ„λ‘œ κ°œμ„ λ˜μ—ˆμ§€λ§Œ 뢈일치, 특히 1.9 μ΄μ „μ—λŠ” μ‘΄μž¬ν•˜μ§€ μ•Šμ•˜λ˜ 뢈일치λ₯Ό λ°œκ²¬ν•˜λ©΄ 보고해 μ£Όμ‹­μ‹œμ˜€.

μ§€κΈˆ λˆ„λ½λœ μœ μΌν•œ μ–Έμ–΄λŠ” Rust와 같이 1.9 이전에 μ§€μ›ν–ˆλ˜ VSCode의 ν”ŒλŸ¬κ·ΈμΈμ— μ˜μ‘΄ν•˜λŠ” μ–Έμ–΄λΏμž…λ‹ˆλ‹€. 일주일 λ™μ•ˆ μž‘μ—…ν•˜κ³  μΆœμ‹œλ˜λ©΄ 이 문제λ₯Ό μ’…λ£Œν•˜κ² μŠ΅λ‹ˆλ‹€.

κΈ°λ‹€λ € μ£Όμ…”μ„œ κ°μ‚¬ν•©λ‹ˆλ‹€ :)

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

μ΅œλŒ€ν•œ 빨리 μž‘μ—…ν•˜κ² μŠ΅λ‹ˆλ‹€. λͺ¨λ‘ νž˜λ‚΄μ‹œκ³  λΆˆνŽΈμ„ λ“œλ € μ£„μ†‘ν•©λ‹ˆλ‹€ :(

방금 버전 1.0.0을 μΆœμ‹œν–ˆλŠ”λ° 버전 1.9에 λŒ€ν•œ 지원이 μ΅œμ†Œν™”λ˜μ—ˆμŠ΅λ‹ˆλ‹€.

일뢀 μ–Έμ–΄λŠ” λ‹¨μˆœνžˆ VS Codeμ—μ„œ 잘 μ§€μ›λ˜μ§€ μ•ŠμœΌλ©° 쒋은 색상을 ν—ˆμš©ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€(예: Java).

λ‚΄ μ•žμ—λŠ” 아직 ν•  일이 λ§Žλ‹€. 1.9 이전과 λ™μΌν•œ 지원을 얻을 수 μžˆλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. 일뢀 μ–Έμ–΄(예: Python)λŠ” λ§ˆμ§€λ§‰ 버전과 λΉ„κ΅ν•˜μ—¬ ν˜„μž¬ μ—¬μ „νžˆ 맀우 λ‚˜μ©λ‹ˆλ‹€. μ£„μ†‘ν•©λ‹ˆλ‹€. μž‘μ—… μ€‘μž…λ‹ˆλ‹€.

μ§„ν–‰ν•˜λ©΄μ„œ 이 문제λ₯Ό μ—…λ°μ΄νŠΈν•˜κ² μŠ΅λ‹ˆλ‹€.

κΈ°λ‹€λ¦¬μ‹œλŠ” 뢄듀을 μœ„ν•΄ 1.1.0 버전이 1.9 이전 버전과 λ™μΌν•œ 색상을 가지고 μžˆλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. VSCode Marketplaceμ—μ„œ μ—…λ°μ΄νŠΈν•˜λ©΄ λ©λ‹ˆλ‹€.

Ruby 및 JS/TS와 같은 일뢀 μ–Έμ–΄λŠ” μƒˆλ‘œμš΄ λ²”μœ„λ‘œ κ°œμ„ λ˜μ—ˆμ§€λ§Œ 뢈일치, 특히 1.9 μ΄μ „μ—λŠ” μ‘΄μž¬ν•˜μ§€ μ•Šμ•˜λ˜ 뢈일치λ₯Ό λ°œκ²¬ν•˜λ©΄ 보고해 μ£Όμ‹­μ‹œμ˜€.

μ§€κΈˆ λˆ„λ½λœ μœ μΌν•œ μ–Έμ–΄λŠ” Rust와 같이 1.9 이전에 μ§€μ›ν–ˆλ˜ VSCode의 ν”ŒλŸ¬κ·ΈμΈμ— μ˜μ‘΄ν•˜λŠ” μ–Έμ–΄λΏμž…λ‹ˆλ‹€. 일주일 λ™μ•ˆ μž‘μ—…ν•˜κ³  μΆœμ‹œλ˜λ©΄ 이 문제λ₯Ό μ’…λ£Œν•˜κ² μŠ΅λ‹ˆλ‹€.

κΈ°λ‹€λ € μ£Όμ…”μ„œ κ°μ‚¬ν•©λ‹ˆλ‹€ :)

λ‹€μŒκ³Ό 같은 뢈일치λ₯Ό λ°œκ²¬ν–ˆμŠ΅λ‹ˆλ‹€.

μ–Έμ–΄: μžλ°”μŠ€ν¬λ¦½νŠΈ

전에:
screen shot 2017-02-07 at 7 33 48 pm

후에:
screen shot 2017-02-07 at 7 34 08 pm

λ¬Έμ œλŠ” λŒ€κ΄„ν˜Έμ™€ κ·Έ μ•ˆμ˜ μ½”λ“œμ— μžˆλŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.

μƒ˜ν”Œ μ½”λ“œλŠ”

export default class Definition {
    constructor(def) {
        if (invalidParams(def)) {
            throw new Error('Invalid arguments provided to Lang constructor');
        }

        this.__def = def instanceof Map ? def : new Map(def);
    }

    clone = () => new Definition(new Map(this.__def));

    extend = (def) => {
        if (invalidParams(def)) {
            throw new Error(`extend requires Map`);
        }

        const extendedLang = new Map(this.__def);

        for (const [key, value] of def) {
            extendedLang.set(key, value);
        }

        return new Definition(extendedLang);
    }
}

μ‹ κ³ ν•΄ μ£Όμ…”μ„œ κ°μ‚¬ν•©λ‹ˆλ‹€!

였늘 밀에 이것을 μ‚΄νŽ΄λ³΄κ³  λ‹€μ‹œ μ—°λ½λ“œλ¦¬κ² μŠ΅λ‹ˆλ‹€.

κ²°μ •λœ. 맀일 μƒˆ 버전을 μ‚¬μš©μžμ—κ²Œ λ„˜μΉ˜κ²Œ ν•˜μ§€ μ•Šλ„λ‘ λ‚˜λ¨Έμ§€ μž‘μ—…μ΄ μ™„λ£Œλ  λ•ŒκΉŒμ§€ 보λ₯˜ν•˜κ² μŠ΅λ‹ˆλ‹€(과거에 이에 λŒ€ν•œ λͺ‡ 가지 뢈만 사항을 μˆ˜μ‹ ν•¨). 이것은 버전 1.2.0μ—μ„œ μΆœμ‹œλ  것 μž…λ‹ˆλ‹€.

λΉ„κ΅ν•˜λ €κ³ ,

μ›μž:
screen shot 2017-02-07 at 23 35 12

VSμ½”λ“œ:
screen shot 2017-02-07 at 23 35 56

constructor ν‚€μ›Œλ“œλŠ” λΆˆν–‰νžˆλ„ λ‹€λ₯Έ λ§Žμ€ ν•­λͺ©μ˜ 색상을 ν•¨κ»˜ λ³€κ²½ν•˜μ§€ μ•Šκ³ λŠ” 선택할 수 μ—†μŠ΅λ‹ˆλ‹€... JS의 Const 선언에도 이와 λ™μΌν•œ λ¬Έμ œκ°€ 있으며 κ³ μœ ν•œ λ²”μœ„κ°€ μ—†μŠ΅λ‹ˆλ‹€. VSCodeκ°€ κ°œμ„ λ˜λ©΄ 이 문제λ₯Ό μˆ˜μ •ν•˜λ„λ‘ μ—…λ°μ΄νŠΈν•˜κ² μŠ΅λ‹ˆλ‹€.

μ°Έμ—¬ν•΄μ£Όμ…”μ„œ λ‹€μ‹œ ν•œ 번 κ°μ‚¬λ“œλ¦½λ‹ˆλ‹€ :)

λΉ λ₯Έ 처리 κ°μ‚¬ν•©λ‹ˆλ‹€!

ν•˜μ§€λ§Œ ν•œ 가지 질문이 μžˆμŠ΅λ‹ˆλ‹€. const 선언은 1.9 이전에 μ˜¬λ°”λ₯΄κ²Œ μž‘λ™ν–ˆμœΌλ©° λ˜ν•œ 보면 for λ£¨ν”„μ˜ const 선언이 μ˜¬λ°”λ₯΄κ²Œ μž‘λ™ν•˜κ³  μžˆμŠ΅λ‹ˆλ‹€. κ·Έλ ‡λ‹€λ©΄ μ™œ μœ„μ— μžˆλŠ” 것이 μ•„λ‹Œκ°€?

for 루프 λ‚΄λΆ€μ˜ [key, value] λŠ” λ°°μ—΄ λ³€μˆ˜ μ„ μ–Έμ΄λ―€λ‘œ VSCodeλŠ” λ‚΄κ°€ μ‚¬μš©ν•œ 고유 λ²”μœ„λ₯Ό μ œκ³΅ν•©λ‹ˆλ‹€.

extendedLang constλŠ” 일반 λ³€μˆ˜λ‘œ κ°μ§€λ©λ‹ˆλ‹€. μ•„λž˜ κ·Έλ¦Όκ³Ό 같이:

screen shot 2017-02-07 at 23 48 59

그것이 κ°€μž₯ ꡬ체적인 λ²”μœ„μž…λ‹ˆλ‹€. 그리고 λ³΄μ‹œλ‹€μ‹œν”Ό λ‹€λ₯Έ μŠ€μ½”ν”„λŠ” const μ„ μ–ΈμœΌλ‘œ κ°μ§€ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. κ·Έλž˜μ„œ μ§€κΈˆ 색상을 μ§€μ •ν•˜λ©΄ λͺ¨λ“  λ³€μˆ˜λ„ 빨간색이 λ©λ‹ˆλ‹€.
μ΄λŸ¬ν•œ 좩돌이 λ°œμƒν•˜λ©΄ 선택을 ν•΄μ•Ό ν•˜λ―€λ‘œ 일반적으둜 κ°€μž₯ 일반적인 λ²”μœ„λ‚˜ λˆˆμ— 더 μ‰½κ²Œ λ³΄μ΄λŠ” 색상이 μ΄κΉλ‹ˆλ‹€. 이 경우 λ³€μˆ˜λŠ” 훨씬 더 일반적이고 const와 μΌμΉ˜ν•˜λ„λ‘ λΉ¨κ°„μƒ‰μœΌλ‘œ λ§Œλ“œλŠ” 것은 Atom의 μ›λž˜ ν…Œλ§ˆμ™€ 훨씬 더 λ§Žμ€ 차이λ₯Ό μ•ΌκΈ°ν•  κ²ƒμž…λ‹ˆλ‹€.

이것이 이전에 μž‘λ™ν•œ μ΄μœ μ— λŒ€ν•΄ VSCodeλŠ” 이제 이전 버전과 μ™„μ „νžˆ λ‹€λ₯Έ λ²”μœ„λ₯Ό λ…ΈμΆœν•©λ‹ˆλ‹€. μ•„λ§ˆλ„ 이 경우 λ³€μˆ˜ 선언을 const와 κ΅¬λ³„ν•˜λŠ” 방법이 μžˆμ—ˆμ„ κ²ƒμž…λ‹ˆλ‹€.

이제 const와 λ³€μˆ˜κ°€ μ •ν™•νžˆ λ™μΌν•œ λ²”μœ„λ₯Ό κ°–λŠ” 것을 λ³Ό 수 μžˆμŠ΅λ‹ˆλ‹€.
screen shot 2017-02-07 at 23 56 35

Atom은 constant.other.js λ²”μœ„λ₯Ό λ…ΈμΆœν•˜λ―€λ‘œ μ‚¬μš©μž μ •μ˜ 색상을 μ œκ³΅ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

μžμ„Έν•œ μ„€λͺ… κ°μ‚¬ν•©λ‹ˆλ‹€!

λͺ¨λ“  λ³€μˆ˜ μœ ν˜•μ„ μΌκ΄€λ˜κ²Œ μƒ‰μΉ ν•˜λŠ” μ˜΅μ…˜μ„ λ§Œλ“€ 수 μžˆμŠ΅λ‹ˆκΉŒ? (λΉ¨κ°„μƒ‰μœΌλ‘œ μΆ”μΈ‘)

μ΅œλŒ€ν•œ Atom ν…Œλ§ˆλ₯Ό λ”°λ₯΄λ €κ³  λ…Έλ ₯ν•©λ‹ˆλ‹€. Atom은 λ³€μˆ˜( var λ˜λŠ” let )에 색상을 μ§€μ •ν•˜μ§€ μ•ŠμœΌλ©° νšŒμƒ‰μž…λ‹ˆλ‹€. κ·Έλž˜μ„œ κ·ΈλŒ€λ‘œ λ‘κ² μŠ΅λ‹ˆλ‹€.

μ›μž:
screen shot 2017-02-09 at 00 09 26

μ–Έμ œλ“ μ§€ ν”„λ‘œμ νŠΈλ₯Ό ν¬ν¬ν•˜κ³  μ›ν•˜λŠ” 경우 μ‚¬μš©μž 지정할 수 μžˆμŠ΅λ‹ˆλ‹€. MIT λΌμ΄μ„ μŠ€μž…λ‹ˆλ‹€. :)

μ–΄μ¨Œλ“  여기에 버그가 μžˆμŠ΅λ‹ˆλ‹€.
image
μ•”ν˜Έ:

import * as styles from './mission.scss';

export default function MissionIcon({ key, title }) {
    return <i class={classnames(
        styles['mission__icon'],
        {
            [styles['mission__icon-letter']]: title.match(A_HEBREW_LETTER),
            [styles['mission__icon-first']]: !key,
        }
    )}>{title}</i>;
}

κ°μ‚¬ν•©λ‹ˆλ‹€!

쑰금 더 정보λ₯Ό μ œκ³΅ν•  수 μžˆμŠ΅λ‹ˆκΉŒ? 이것은 JS λ˜λŠ” TS νŒŒμΌμž…λ‹ˆκΉŒ? 이게 λ¦¬μ•‘νŠΈμΈκ°€μš”?

image
또 λ‹€λ₯Έ 버그:

  • λ…Έλž€μƒ‰μ˜ μ€‘κ΄„ν˜Έ 및 μ„Έλ―Έμ½œλ‘ 
  • νšŒμƒ‰ μž₯식 @
  • λ³€μˆ˜μ˜ 색상이 μΌμΉ˜ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€(λ˜λŠ” ν‚€κ°€ 되기 λ•Œλ¬Έμ— μ˜λ„λœ κ²ƒμž…λ‹ˆκΉŒ?)
    μ•”ν˜Έ:
@connect(
    ({ artists }) => ({ artists }),
    dispatch => bindActionCreators({ getArtists, getArtist, addArtist, editArtist, removeArtist }, dispatch)
)
export default class AdminArtists extends Component {

    componentWillMount = () => {
        this.props.getArtists();
    }

    render = () => {
        console.log(this.props.artists);
        return <div>

        </div>;
    }
}

@akamud JS 리

이 JS React 문제λ₯Ό μΆ”μ ν•˜κΈ° μœ„ν•΄ μƒˆ 문제λ₯Ό λ§Œλ“€κ² μŠ΅λ‹ˆλ‹€.

이 토둠을 λ”°λ₯΄λ €λ©΄ #36을 μ‚¬μš©ν•˜μ‹­μ‹œμ˜€.

버전 1.2.0은 이제 이전과 λ™μΌν•œ ν”ŒλŸ¬κ·ΈμΈ 지원을 μ œκ³΅ν•©λ‹ˆλ‹€.

λ‹€λ₯Έ 뢈일치λ₯Ό 찾으면 μƒˆ 문제λ₯Ό λ§Œλ“œμ‹­μ‹œμ˜€.

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