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

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

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

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

ESLint

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

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

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

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

Q&A

解決済

1回答

6948閲覧

ESLintのエラーを解決したい

ksyunnnn

総合スコア60

Babel

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

ESLint

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

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

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

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

0グッド

0クリップ

投稿2017/07/27 08:09

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

「ゼロから始めるJavaScript生活」というjavascriptフルスタックを目指すチュートリアルの途中のLintの導入でつまずいています。
http://qiita.com/takahashim/items/7838334d1451fb0a9811#6---eslint

”6 - ESLint”を終えた段階ですが、記載のようにエラーが消えず、発生したままになってしまいます。
対処法をお教えいただきたく。。。

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

yarn start v0.27.5 $ gulp [07:41:35] Requiring external module babel-register [07:41:36] Using gulpfile ~/workspace/nodetest/gulpfile.babel.js [07:41:36] Starting 'watch'... [07:41:36] Finished 'watch' after 22 ms [07:41:36] Starting 'lint'... [07:41:36] Starting 'clean'... [07:41:36] Finished 'clean' after 22 ms [07:41:39] /home/ubuntu/workspace/nodetest/src/dog.js 1:1 error Definition for rule 'jsx-a11y/href-no-hash' was not found jsx-a11y/href-no-hash /home/ubuntu/workspace/nodetest/src/index.js 2:1 error Definition for rule 'jsx-a11y/href-no-hash' was not found jsx-a11y/href-no-hash /home/ubuntu/workspace/nodetest/gulpfile.babel.js 2:1 error Definition for rule 'jsx-a11y/href-no-hash' was not found jsx-a11y/href-no-hash 21:35 error Missing trailing comma comma-dangle 29:35 error Missing trailing comma comma-dangle 34:5 warning Unexpected console statement no-console ✖ 6 problems (5 errors, 1 warning) 2 errors, 0 warnings potentially fixable with the `--fix` option. [07:41:39] 'lint' errored after 2.91 s [07:41:39] ESLintError in plugin 'gulp-eslint' Message: Failed with 5 errors

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

すべてのソースはGithubにあります。
https://github.com/ksyunnnn/zero-js-life
どこに原因があるのかわからないので、いくつかピックして記載します。

gulpfile.babel.js

js

1/* eslint-disable import/no-extraneous-dependencies */ 2import gulp from 'gulp'; 3import babel from 'gulp-babel'; 4import del from 'del'; 5import { exec } from 'child_process'; 6import eslint from 'gulp-eslint'; 7 8const paths = { 9 allSrcJs: 'src/**/*.js', 10 gulpFile: 'gulpfile.babel.js', 11 libDir: 'lib', 12}; 13 14gulp.task('lint', () => 15 gulp.src([ 16 paths.allSrcJs, 17 paths.gulpFile, 18 ]) 19 .pipe(eslint()) 20 .pipe(eslint.format()) 21 .pipe(eslint.failAfterError()) 22); 23 24gulp.task('clean', () => del(paths.libDir)); 25 26gulp.task('build', ['lint', 'clean'], () => 27 gulp.src(paths.allSrcJs) 28 .pipe(babel()) 29 .pipe(gulp.dest(paths.libDir)) 30); 31 32gulp.task('main', ['build'], (callback) => { 33 exec(`node ${paths.libDir}`, (error, stdout) => { 34 console.log(stdout); 35 return callback(error); 36 }); 37}); 38 39gulp.task('watch', () => { 40 gulp.watch(paths.allSrcJs, ['main']); 41}); 42 43gulp.task('default', ['watch', 'main']);

index.js

js

1/* eslint-disable no-console */ 2import Dog from './dog'; 3 4const toby = new Dog('Toby'); 5console.log(toby.bark());

dog.js

js

1class Dog { 2 constructor(name) { 3 this.name = name; 4 } 5 6 bark() { 7 return `Wah wah, I am ${this.name}`; 8 } 9} 10 11export default Dog;

###試したこと

ESLintのバージョンに問題がある?といった記事をみかけましたが、実際はよくわかっていませんm(_ _)m
https://github.com/facebookincubator/create-react-app/issues/2631

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

  • node : v6.11.1
  • IDE : Cloud9

よろしくお願いいたしますm(_ _)m

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

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

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

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

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

guest

回答1

0

ベストアンサー

eslint-plugin-jsx-a11y と言う eslint plugin の version 6 で jsx-a11y/href-no-hash というリントルールが無くなった (リネームされた) ことが原因のようです。

一旦 eslint-plugin-jsx-a11y を削除して

yarn remove eslint-plugin-jsx-a11y

version 5 を指定してインストールすれば改善するのではと思います。

yarn add --dev eslint-plugin-jsx-a11y@^5.1.1

投稿2017/07/27 08:35

kt3k

総合スコア87

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

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

ksyunnnn

2017/07/27 08:51

ありがとうございます! 上記対応に加えて、 index.jsへの下記の追加 /* eslint-disable no-console */ カンマなどのLintエラーの対処を行うことで対処できたようです。 助かりましたm(_ _)m
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問