Как я могу использовать Flowtype и eslint с Vue / Nuxt? - PullRequest
0 голосов
/ 27 апреля 2018

Я пытаюсь установить Flowtype с помощью eslint и Vue.js / Nuxt.js как для шаблона, так и для скрипта.

Я установил flow и получаю хорошую обратную связь в Atom, как от flow, так и от eslint (yay), а prettier-atom работает как чудо ... после нескольких часов попыток, так как я никогда не играл с ними раньше.

Теперь я хотел бы знать, если:

1) Я пропустил конфигурацию

2) возможно сделать поток не сообщающим Unexpected token @ в моем Vuejs с конфигом или пакетом

3) Можно ли заставить Atom / eslint / flow сообщать об ошибке, если моя @click="something" функция в порядке (следуйте правилам), например, или если переменная в data() никогда не используется в шаблоне или сценарий и т. д.

Для справки: сначала мне удалось заставить все работать с prettier-atom, и теперь я пытаюсь добавить поддержку Vue / Nuxt. Я перешел по этой ссылке , чтобы настроить ее.

devDependencies:

"devDependencies": {
    "babel-eslint": "^8.2.3",
    "eslint-plugin-flowtype": "^2.46.3",
    "babel-plugin-syntax-flow": "^6.18.0",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-flow-strip-types": "^6.22.0",
    "eslint": "^4.19.1",
    "eslint-config-vue": "^2.0.2",
    "eslint-plugin-babel": "^5.1.0",
    "eslint-plugin-flowtype-errors": "^3.5.1",
    "eslint-plugin-html": "^4.0.3",
    "eslint-plugin-prettier": "^2.6.0",
    "eslint-plugin-vue": "^4.5.0",
    "prettier": "^1.12.1",
    "prettier-eslint": "^8.8.1"
  },

eslintrc:

root: true,
"parser": "babel-eslint",

"plugins": [
  "html",
  "flowtype",
  "prettier"
],
settings: {
  flowtype: {
    onlyFilesWithFlowAnnotation: false
  }
},
"extends": [
  "vue"
],

parserOptions: {
  ecmaVersion: 6,
  ecmaFeatures: {
    unicodeCodePointEscapes: true,
    globalReturn: true,
    jsx: true
  }
},
"globals": {
  "axios": true
},
"env": {
  "browser": true,
  "node": true,
  "commonjs": true,
  "es6": true
},

Я опустил правила, потому что у меня есть все правила и их описания, пока я выясняю, чего я хочу.

babelrc:

{
   "plugins": [
    "babel-plugin-transform-class-properties",
    "babel-plugin-syntax-flow",
    "babel-plugin-transform-flow-strip-types"
  ]
}

Мой "тестовый" код:

<template>
  <p>I'm made with Flow and a bunch of other cool stuff! {{ defined }}</p>
  <a @click="actionDefined">Submit this {{ NotDefined }}.</a>
  <a @click="actionUndefined">Looks like this one won't work.</a>
</template>

<script>
export default {
  created() {
    console.log(randomThing)
  },
  data() {
    return {
      defined: "boop!",
    }
  },
  methods: {
    async actionDefined() {
      console.log("yay")
    },
  }
}
</script>

Буду очень признателен за вашу помощь, Спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...