Help us understand the problem. What is going on with this article?

VeturにTypeScript3.7のOptional Chainingを適用してみる

TL;DR

settings.json
{
    // Use dependencies from workspace. Currently only for TypeScript.
    "vetur.useWorkspaceDependencies": true, 
}

概要

TypeScript 3.7のOptional Chainingは最高!!
いつも「なんで?.で書けないんだ」って思っていたけど、ついに来た!

ただ...VueというかVeturで使うには...
Veturは固定のTypeScriptバージョンに依存している1
最新サポートしているバージョンはVetur0.22.3のTypeScript3.6.3。
このままTypeScript 3.7のOptional Chainingを書いたら、Veturに怒られる
コメント 2019-11-11 232438.png
トランスパイルしているのはあくまでtscなので、実害があるわけじゃないが、Intelligenceが効かなくなるのは相当な痛手だ。

解決策

探してみたらちゃんとあった、

Allow using workspace typescript version#682
how can i use optionalChaining?#1438

Vetur 0.17.0以降、"vetur.useWorkspaceDependencies"のオプションを設定できるらしい。
字面通りの意味なら、この設定をしたら、ワークスペースのTypeScriptバージョンを使ってくれるみたい!

ワークスペースのTypeScriptのバージョンを3.7.2に上げて、

$ npm install typescript@3.7.2 --save-dev

ESLintのparserの@typescript-eslint/parserを最新バージョンの2.7.0に更新する。(3.7.2対応のparserにしないと表示が色々おかしくなる)

$ npm install @typescript-eslint/parser@2.7.0 --save-dev

VSCodeのsettings.json

settings.json
{
    // Use dependencies from workspace. Currently only for TypeScript.
    "vetur.useWorkspaceDependencies": true, 
}

を追加したら、Optional Chainをちゃんと認識してくれるようになった!(VSCodeの再起動必須)
スクリーンショット (2).png

使用環境

TypeScript 3.7.2
VSCode 1.40.0
Vetur 0.22.6
ESLint 5.16.0

ESLint 設定

.eslintrc.js
module.exports = {
    parserOptions: {
        parser: '@typescript-eslint/parser',
    },

    extends: [
        // ...
    ],
};

  1. how can i use optionalChaining?#1438 Comment https://github.com/vuejs/vetur/issues/1438#issuecomment-533952010 

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした