Я пытаюсь установить 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>
Буду очень признателен за вашу помощь,
Спасибо!