Ajouter code linting

[abulte]

Voilà en gros ce que je trouve chez moi. Le "problème" c'est que tout est installé automatiquement par vue-cli create dans mon cas, donc je n'ai jamais monté le tooling from scratch.

Plugin vscode : https://github.com/Microsoft/vscode-eslint

Dans le settings.json de vscode :

    "eslint.validate": [
      {
        "language": "vue",
        "autoFix": false
      },
      {
        "language": "html",
        "autoFix": false
      },
      {
        "language": "javascript",
        "autoFix": false
      }
    ],

.eslintrc.js à côté du package.json

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

.editorconfig à la racine du projet

[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
trim_trailing_whitespace = true
insert_final_newline = true

Et probablement des dépendances à installer, du genre (ce que j'ai chez moi) :
yarn add @vue/eslint-config-standard babel-eslint eslint eslint-plugin-import eslint-plugin-node eslint-plugin-promise eslint-plugin-standard eslint-plugin-vue --dev

Référence potentiellement intéressante : https://alligator.io/vuejs/eslint-vue-vetur/

[abulte]

Si j'essaie dans ton projet:

vi frontend/.eslintrc.js

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

yarn add @vue/eslint-config-standard babel-eslint eslint eslint-plugin-import eslint-plugin-node eslint-plugin-promise eslint-plugin-standard eslint-plugin-vue --dev

Après je peux faire:

npx eslint components/**.vue par exemple

[abulte]

Après réflexion, je me demande si le plus simple ne serait pas de repartir d'un projet Nuxt vierge, avec le nuxt-app qui te fait la conf eslint qui va bien. Ca + https://github.com/Microsoft/vscode-eslint, ça devrait le faire.

yarn create nuxt-app test-nuxt
yarn create v1.22.4
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 🔨  Building fresh packages...
success Installed "[email protected]" with binaries:
      - create-nuxt-app

create-nuxt-app v2.15.0
✨  Generating Nuxt.js project in test-nuxt
? Project name test-nuxt
? Project description My classy Nuxt.js project
? Author name Alexandre Bulté
? Choose programming language JavaScript
? Choose the package manager Yarn
? Choose UI framework Vuetify.js
? Choose custom server framework None (Recommended)
? Choose Nuxt.js modules (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Choose linting tools (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Choose test framework None
? Choose rendering mode Single Page App
? Choose development tools (Press <space> to select, <a> to toggle all, <i> to invert selection)

[JulienParis]

notes pour plus tard : trailing spaces Visual Code Studio Julien / standard... cf : https://standardjs.com

[JulienParis]

gros linting dans cette PR : #14

avec ce fix : https://fr.nuxtjs.org/guide/development-tools/#eslint-et-prettier

en gros eslint est installé mais ne run pas par défaut... on peut faire npm run lint pour voir où sont les erreurs et npm run lintfix pour en corriger un maximum... reste qu'il y aura du cleaning à faire fichier par fichier à l'occasion

[JulienParis]

les lignes 237-244 dans le fichier nuxt.config.js permettent de lancer ESlint en mode dev, mais bon pour le moment ça fait bcp de cleaning

[JulienParis]

j'ai installé StandardJS et fait un gros cleaning ici => #60

[JulienParis]

une fois la PR #60 acceptée on pourra fermeer cette issue