web-dev-qa-db-ja.com

Chrome ES6文字列リテラル/ Typescriptに関する開発ツールの問題

TypeScriptと、ES6文字列リテラルのようなTypeScriptによって公開されるES6機能のいくつかを使用してプロジェクトに取り組んでいます。 `Something ${variable} Something else`。

問題をデバッグしている間、TypeScriptファイルにブレークポイントをドロップして、通常は正常に機能するソースパネルでステップスルーしました。

しかしChrome Dev ToolsにはES6文字列リテラルに関する問題があり、ES6文字列リテラルの終わりを認識していないようです。

代わりに、文字列リテラルに続くすべてのコードは赤でマークされ（デバッガーで文字列が強調表示され）、変数検査からブロックされますchromeデバッガーはすべて1つの大規模な文字列であると考えているようです。

誰かがこの問題に遭遇したり、修正を見つけたり、これがChrome開発ツールのGoogleのロードマップにあるかどうかを知っていますか？

EDIT 1：
この問題は、現在Chromiumチームが取り組んでいるようです。アップデートについては、問題レポートを参照してください。
bugs.chromium.org/p/chromium/issues/detail?id=659515

編集2：バグはかなり前から公開されていますが、優先順位は付けられていないようです。問題が発生した場合は、上記のクロムリンクに移動し、役立つ情報を添えてスター/コメントを付けて、開発ツールチームの焦点に移動してください。

stringgoogle-chromedebuggingtypescriptgoogle-chrome-devtools
49
Anton v B

Ubuntuのバージョン69.0.3497.100（公式ビルド）（64ビット）はまだバグです。

回避策として、次を追加できます：//`は、chrome sourcesタブの書式を修正する、テンプレート化された文字列を含む行の終わりに追加します。

ここに私のjsxコードのいくつかの例があります。

コンポーネントの小道具で：

  <Field
    name={`${fields.name}[${index}].comments`}// `
    component="input"
    type="text"
  />

子要素として：

  <label>
    {`${t('Condone')}  `}{/* ` */}
  </label>

ステートメントで：

  switch (DEBTTYPE) {
    case DEBTTYPE_MACHINE_PRODUCT:
      id = `machine_product_difference_row_${row.id_productdebt}`;// `
      break;
      ....

私は彼らがこの問題をできるだけ早く修正できることを本当に望んでいます。

16
Rodrirokr

これは 2017年12月14日 DevToolsチームからのコメントによると、DevToolsで使用されているCodeMirrorバージョンが更新されたため、問題は修正されるはずです。 Chrome 64以降で動作するはずです。以前のバージョンのChromeはまだ機能しません。バージョンはchrome://versionで確認できます。 。

3
Kayce Basques