PHPStormでESLintを使って文法チェック

PHPStormを使うようになってからは、PHPStormの機能だけでJavaScriptの文法チェックをしていたけど、ちゃんとlintツールを使うように設定したときの覚書。
環境: Windows 10, PHPStorm 2019.1.2
lintはバグの原因になるような曖昧な記述を警告してくれるプログラム(の総称)。
lint - Wikipedia
JavaScriptのLintツールは今なら「ESLint」を使っておけば間違いない。
まずは公式のスタートガイドを読む。
ESLint - Pluggable JavaScript linterGetting Started with ESLint - ESLint - Pluggable JavaScript linter
npmでインストールする。
# npm install --save-dev eslint
設定ファイルを作る
# vi .eslintrc.json
{
"extends": ["eslint:recommended"],
"env": {
"browser": true,
"jquery": true
},
"rules": {
"strict": ["error", "function"],
"no-console": "error"
}
}
PHPStormの設定 公式サイトのヘルプを参考に。
ESLint - Help | WebStorm
ESLintを「Manual ESLint configuration」にする。
.eslintrc.jsonをPHPStormで編集した後は右クリックで「Apply ESLint Code Style Rules」で読み込む。
単独のjsファイルは問題ないのだけれど、PHPファイル内のscriptタグにはESLintでチェックされない?
JavaScriptのコーディング規約 調べる中で「JavaScript Standard Style」というコーディング規約が広まっているのを知…
環境: Windows 10, PHPStorm 2019.1.2
lintはバグの原因になるような曖昧な記述を警告してくれるプログラム(の総称)。
lint - Wikipedia
JavaScriptのLintツールは今なら「ESLint」を使っておけば間違いない。
まずは公式のスタートガイドを読む。
ESLint - Pluggable JavaScript linterGetting Started with ESLint - ESLint - Pluggable JavaScript linter
npmでインストールする。
# npm install --save-dev eslint
設定ファイルを作る
# vi .eslintrc.json
{
"extends": ["eslint:recommended"],
"env": {
"browser": true,
"jquery": true
},
"rules": {
"strict": ["error", "function"],
"no-console": "error"
}
}
PHPStormの設定 公式サイトのヘルプを参考に。
ESLint - Help | WebStorm
ESLintを「Manual ESLint configuration」にする。
.eslintrc.jsonをPHPStormで編集した後は右クリックで「Apply ESLint Code Style Rules」で読み込む。
単独のjsファイルは問題ないのだけれど、PHPファイル内のscriptタグにはESLintでチェックされない?
JavaScriptのコーディング規約 調べる中で「JavaScript Standard Style」というコーディング規約が広まっているのを知…