@Ioldyz

Настройка Eslint и Webstorm/PhpStorm (проект создан с использованием vue-cli), не могу понять, что не настроено?

Добрый день.
Подскажите пжта, ранее не сталкивался с такой бедой. Использую PhpStorm или Webstorm тут без разницы.
Проект создал с использование vue-cli
Выбрал поддержание TypeScript
Настройки:
WebStorm/PhpStorm

5fcc75ea7ded0434598814.png

.eslintrc.js

module.exports = {
  root: true,
  env: {
    node: true
  },
  'extends': [
    'plugin:vue/essential',
    'eslint:recommended',
    '@vue/typescript/recommended'
  ],
  parserOptions: {
    ecmaVersion: 2020
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }
}


babel.config.js

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}


package.json

{
  "name": "opensource-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "register-service-worker": "^1.7.1",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.3",
    "vue-property-decorator": "^8.4.2",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0",
    "axios": "^0.21.0",
    "dotenv": "^8.2.0",
    "lodash": "^4.17.20",
    "vue-recaptcha": "^1.3.0",
    "vue-toastification": "^1.7.8",
    "vuetify": "^2.3.19"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^2.33.0",
    "@typescript-eslint/parser": "^2.33.0",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-pwa": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/eslint-config-typescript": "^5.0.2",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "node-sass": "^4.12.0",
    "sass-loader": "^8.0.2",
    "typescript": "~3.9.3",
    "vue-template-compiler": "^2.6.11"
  }
}



Ошибка:
При запуске проекта показывает ошибку
скрин браузера

5fcc780aed5c9710805299.png

но при этом в самом WebStorm/PhpStorm всё норм, даже специально как попало ставил пробелы и т.д., ошибок не показывает
скрин
5fcc788a096bd517525386.png

подскажите , как правильно настроить WebStorm/PhpStorm, чтоб ошибки нормально показывало, до этого стояла настройка по Eslint "Automatic ESLint configuration" и было всё норм... То есть ошибки выводимые в браузере совпадали с ошибками в IDE. Сейчас как видно не так.
Может еще сам ESLint у меня не очень настроен для работы с Vue 2 проектами и TypeScript
Буду признателен за помощь. Заранее спасибо
  • Вопрос задан
  • 4602 просмотра
Решения вопроса 1
@Ioldyz Автор вопроса
всем спасибо, помогло https://stackoverflow.com/a/64175035
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы