質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.49%
ESLint

ESLintは、JavaScriptのための構文チェックツール。全検証ルールを自由に on/offでき、独自のプロジェクトに合わせたカスタムルールを容易に設定することが可能。公開されている様々なプラグインを組み込んで使用することもできます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

4133閲覧

【ESLint】no-multi-spacesに見逃してほしい配列整形

himejiy3

総合スコア77

ESLint

ESLintは、JavaScriptのための構文チェックツール。全検証ルールを自由に on/offでき、独自のプロジェクトに合わせたカスタムルールを容易に設定することが可能。公開されている様々なプラグインを組み込んで使用することもできます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

1グッド

0クリップ

投稿2017/08/22 10:07

編集2017/08/23 03:09

###前提・実現したいこと

こちらの2次元配列を

JavaScript

1const mens = [ 2 ["田居", "tai.png", 25], 3 ["成屋", "seiya.png", 19], 4 ["加間", "kama.png", 22] 5];

次のように整形したいのですが、

JavaScript

1const mens = [ 2 ["田居", "tai.png", 25], 3 ["成屋", "seiya.png", 19], 4 ["加間", "kama.png", 22] 5];

###発生している問題・エラーメッセージ

ESLintに

'Multiple spaces found before '25'. (no-multi-spaces)' 'Multiple spaces found before '22'. (no-multi-spaces)'

と言われてしまいます。

###該当のソースコード

以下のように書けば回避できるものの、根本的な解決になっていません。

JavaScript

1/* eslint-disable no-multi-spaces */ 2const mens = [ 3 ["田居", "tai.png", 21], 4 ["成屋", "seiya.png", 19], 5 ["加間", "kama.png", 20] 6]; 7/* eslint-enable no-multi-spaces */

pngファイル名の長さを整えれば・・という発想もあるでしょうけれど、それは言わない約束でお願いします。

###試したこと
Parsar Demo」で上記コードを入力してみましたが、「だから…何?(汗)」といった感じで、右画面に出力されたパラメータを活かす知識はありませんでした。
ESTree」に何らかのヒントがあるらしいという情報も得たのですが、どこをどう見れば良いやら途方に暮れてしまいました。

###補足情報(言語/FW/ツール等のバージョンなど)

「.eslintrc.json」の該当箇所は以下のような感じにしています。

JSON

1"rules": { 2 "no-multi-spaces": ["error", 3 { "ignoreEOLComments": true, 4 "exceptions": { "Property": true, 5 "VariableDeclarator": true, 6 "AssignmentExpression": true } }], 7}

ArrayExpressionを使えば良いのかなと、よく分からないながらも試してみましたがダメでした。
(2017-08-23-12:07追記:試されていなかったようです。お騒がせして申し訳ございません。自己解決しました。)

ご教授よろしくお願いいたします。

zhangyiyi👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/08/22 10:48

なぜ、配列の中の値の区切りに複数スペースを空けたいのですか?半角スペース一つではダメなのですか?
himejiy3

2017/08/22 13:15

他人が見る際に、見やすくしておきたいからです。ここで言う他人とは、このコードを書いたことを忘れているであろう1年後の自分も含めます。
guest

回答1

0

自己解決

自己解決しました。
結論から言うと、「.eslintrc.json」において

JSON

1no-multi-spaces: ["error", { "exceptions": { "ArrayExpression": true } }]

と例外を追加すればOKでした。
これについては試したつもりだったのですが・・・
スペルミスがあったのか、ファイル保存していなかったのか・・謎です。
大変失礼しました。

2次元配列の整形については、
実はもうひとつ「array-bracket-spacing」に悩まされていますが
これについてはひとまず「off」で妥協しておくことにしました。

これらにより

JavaScript

1const banmenHyouka = [ 2 [10, 15, 15, 15, 1, 10], 3 [30, 0, -5, -5, 0, 1], 4 [1, 20, 0, 2, -5, 10], 5 [10, -5, 25, 0, 20, 30], 6 [1, 0, 2, -5, 0, 1], 7 [10, 1, 15, 15, 15, 10] 8]; 9

といった記述を

JavaScript

1const banmenHyouka = [ 2 [10, 15, 15, 15, 1, 10], 3 [30, 0, -5, -5, 0, 1], 4 [ 1, 20, 0, 2, -5, 10], 5 [10, -5, 25, 0, 20, 30], 6 [ 1, 0, 2, -5, 0, 1], 7 [10, 1, 15, 15, 15, 10] 8]; 9

と整えても、ESLintに警告されないようになりました。

もしくは「"array-bracket-spacing" : ["error","always"]」と設定すれば

JavaScript

1const banmenHyouka = [ 2 [ 10, 15, 15, 15, 1, 10 ], 3 [ 30, 0, -5, -5, 0, 1 ], 4 [ 1, 20, 0, 2, -5, 10 ], 5 [ 10, -5, 25, 0, 20, 30 ], 6 [ 1, 0, 2, -5, 0, 1 ], 7 [ 10, 1, 15, 15, 15, 10 ] 8]; 9

といった整形でエラーになりません。

本当は「"array-bracket-spacing" : ["error","never"]」と設定した上で
2次元配列における先頭の「"["」のみ例外とする方法を取りたいのですが
そんな設定が出来るのかどうか、皆目、見当もつきません。
これについてはあきらめました。

投稿2017/08/23 03:01

himejiy3

総合スコア77

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.49%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問