Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Formatting TypeScript

Formatting TypeScript

TypeScriptのフォーマットに関して
We Are Javascritpters #13

More Decks by Taketoshi Aono(青野健利 a.k.a brn)

Other Decks in Programming

Transcript

  1. Formatting
    TypeScript

    View Slide

  2. せ⵸: @brn (ꫬꅿ⨳ⵃ)
    耵噟: ؿٗٝزؒٝسؒٝآص،٥ط؎ذ؍ـؒٝآص،
    ⠓爡: Cyberagent ،سذؙأةآؔRightSegment٥AI Messenger
    ـؚٗ: http://abcdef.gets.b6n.ch/
    Twitter: https://twitter.com/brn227
    GitHub: https://github.com/brn

    View Slide

  3. 鳞ְֿה
    ؝٦ر؍ؚٝ鋉秈⡲׶׋ֻזְկ
    ٖؽُ٦׃׋ֻזְկ

    View Slide

  4. tslintָ֮׷
    ֽוְׇ׈ְfixתד׃ַ׃גֻ׸זְկ

    View Slide

  5. prettier
    ׅ׀ֻؿؓ٦وحز׃גֻ׸תׅיկ

    View Slide

  6. Conflict
    ֮ծֽוֿֿtslintהעאַ׏גתׅי…

    View Slide

  7. tslint-plugin-prettier
    conflictׅ׷ٕ٦ٕכ搀⸬ח׃ת׃׳ֲկ׉ֲ׃ת׃׳ֲկ

    View Slide

  8. tslint׃䘌׸׷
    ➂꟦דַׅ׵יկ
    pre-commitؿحؙ剅ֹת׃׳ֲ

    View Slide

  9. #!/bin/sh!
    !
    for file in $(git diff --cached --name-only --diff-
    filter=ACM | grep '\.tsx\?$' | tr '\n' ' ')!
    do!
    echo "prettier $file";!
    # Prettify all staged .js files!
    ./node_modules/.bin/tslint $file -c ./tslint.json --
    exclude 'src/**/*.css' --project tsconfig.json --fix!
    !
    # Add back the modified/prettified files to staging!
    git add $file!
    !
    done!

    View Slide

  10. husky and lint-staged
    荈ⴓד剅ֻ״׶嚂דׅיկ
    huskyדpre-commit鏣㹀׃גlint-stagedדlint׾剅ֻ

    View Slide

  11. TypeScriptFormatter
    https://github.com/vvakame/typescript-formatter
    @vvakameׁ׿ָ⡲׏׋װא
    LanguageService⢪׏גؿؓ٦وحز׃תׅ

    View Slide

  12. View Slide

  13. תה׭
    ؝٦سךؿؓ٦وحزכⰋג荈⹛⻉ׅ׷׿װד

    View Slide