0

TypeScriptとNuxt.jsでフロントの開発をしています。
eslintを使い開発をしているのですが、interfaceを定義した際にinterfaceのプロパティでエラーが発生しました。

interface Data {
  name: string
  password: string // Parsing error: Unexpected token
}

以下がエラー全文です。

 ERROR  in ./components/LoginForm/LoginForm.vue                                                                                                                  friendly-errors 21:31:04

Module Error (from ./node_modules/eslint-loader/index.js):                                                                                                       friendly-errors 21:31:04

<project_path>/components/LoginForm/LoginForm.vue
  36:2  error  Parsing error: Unexpected token

  4 | interface Data {
  5 |   name: string
> 6 |   password: string
    |   ^
  7 | }
  8 | 
  9 | export default Vue.extend({

✖ 1 problem (1 error, 0 warnings)

                                                                                                                                                                 friendly-errors 21:31:04
 @ ./node_modules/babel-loader/lib??ref--3-0!./node_modules/ts-loader??ref--3-1!./node_modules/vue-loader/lib??vue-loader-options!./pages/index.vue?vue&type=script&lang=ts& 2:0-61 5:15-24
 @ ./pages/index.vue?vue&type=script&lang=ts&
 @ ./pages/index.vue
 @ ./.nuxt/router.js
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi eventsource-polyfill webpack-hot-middleware/client?reload=true&timeout=30000&ansiColors=&overlayStyles=&name=client&path=/__webpack_hmr/client ./.nuxt/client.js

自分でも色々調べてみましたがこのエラーの解決策を見つけることができませんでした。

追記:
.eslintrc.jsは以下のとおりです。

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true
  },
  parserOptions: {
    parser: 'babel-eslint'
  },
  extends: [
    '@nuxtjs',
    'plugin:nuxt/recommended',
    'plugin:prettier/recommended',
    'prettier',
    'prettier/vue',
  ],
  plugins: [
    'prettier'
  ],
  // add your custom rules here
  rules: {
  }
}
3
  • 単純に、その前の行末にセミコロン ';' が無いとか?
    – kunif
    2019年7月31日 12:42
  • 1
    いえ、多くの場合セミコロンは不要です。(前の文自体は気にはなりましたが) / eslintの設定の問題と思われるんですが.eslintrc.jsなども貼ってもらえますか?(nuxtプロジェクトのデフォルトはいま確認できてないですが)
    – hinaloe
    2019年7月31日 12:44
  • コメントありがとうございます。 .eslintrc.jsを追加しました。
    – hota1024
    2019年7月31日 13:13

1 件の回答 1

1

コメントしていただいた皆様ありがとうございました。
自己解決できました。

eslintのparserをtypescript-eslint-parserにしたら解決しました。

2
  • 1
    ja.nuxtjs.org/guide/typescript にあるとおりですね。ところでインストールされたのは typescript-eslint-parser ですか?これは既に @typescript-eslint/parser に引っ越して非推奨になっているものなのですが……
    – hinaloe
    2019年7月31日 13:45
  • ご指摘ありがとうございます。 気づかないままtypescript-eslint-parserをインストールしてました。 今@typescript-eslint/parserをインストールしています。 ありがとうございます。
    – hota1024
    2019年8月1日 6:06

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。