WebStorm など JetBrains IntelliJ系エディタで、vueファイルの<disable_script>タグ内の1段インデントをさせない (ESLint, TSLint 対応)

1452 ワード
TSLint Vue.js WebStorm ESLint WebStorm テキストリンク

WebStorm で Vue.js の単一ファイルコンポーネントを書いているとき、デフォルトだと Command + Option + L の Reformat Code 時、

<script>
  import ....
  export default {
    ...

このように、<script> タグ内で1段階インデントしてしまいます。

こうなっていると、ESLint でも TSLint でも警告が出ます。

ESLint: Expected indentation of 0 spaces but found 2.(indent)

インデントさせないようにするには、

Command+,(Preference) → Editor / Code Style / HTML の
Do not indent children of: に、script を追加します。

これで、インデントは自動追加されず、すでにインデントされているものは Reformat Code時にアンインデントされるようになります。