LoginSignup
0
0

More than 5 years have passed since last update.

JSHintでasync/awaitに対応する

Posted at

CodeMirrorをつかったweb上のJSエディタを作っているときに
JSのコードのエラー検知をしてくれるJSHintを使っていたけれど,
async/awaitに対応していなかったので,どうにか対応させてみた

対応前

Untitled.png

対応していない状況だと,awaitがあるとエラーになる

Missing semicolon.
Missin name iin function declaration

CodeMirror(Html上のエディタ)を使っているけれども,そっちのキーワードとしては認識されているので,ちゃんとasyncの色が変わっているのが憎い・・・.

キーワード抽出とエラー検知はロジックが全く別のため,こういう現象が起きている.

対応後

名称未設定.png

きちんとエラーが出なくなっている

対応方法

本家のJSHintはまだasync/awaitに対応していなかった

かわりにJSHintをフォークしてasync/awaitを追加してくれている人がいるので,ありがたくそのコードを使わせてもらう
ただし,JSHint自体はnodejs向けに作られているので,browser向けにビルドされたものを抽出するのが必要

ビルドと言っても,nodejs向け→browser向けに変換できるコードがついているので,それを使って作られたjsファイルを一つ追加するだけ

async/awaitが追加されているJSHint
https://github.com/marcominetti/jshint

これのdist/jshint.jsがブラウザ向けにビルドされたもの

awaitの対応を有効にするには,オプションに以下を追加.
やりたいことによっては”asyncawait”のみでもOK

var jshintconfig = {
 experimental:['asyncawait', 'asyncreqawait']

  // asyncawait    : enables async/await functions support.
  // asyncreqawait : requires async functions to contain at least
  //                  one await statement.
}

これで,async/awaitを使ってもエラーがでなくなる

もちろん,async/await関連のエラーも検知する
具体的には下記の3つを検知してくれる模様

E999: "A await statement shall be within an async function (with syntax: `async function`)."
W998: "An async function shall contain an await statement.",
W999: "'{a}' is available in async/await extension(use asyncawait option)."

参考

Stackoverflow
https://stackoverflow.com/questions/42637630/does-jshint-support-the-node-7-async-await

JSHint Options 日本語訳
https://qiita.com/xorphitus/items/f26ec8fbe17c317d3994

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0