Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

html-indent causes eslint to fail when fixing only layout issues #765

Open
fvhockney opened this issue Jan 11, 2019 · 5 comments

Comments

Projects
None yet
2 participants
@fvhockney
Copy link

commented Jan 11, 2019

I am editing this because I have installed a project with @vue/cli: 3.5.5 and am still getting issues. Since we are integrating vue into a legacy code base, we cannot just run npx eslint --fix file.vue. This command runs and fixes all issues, but npx eslint --fix --fix-type layout file.vue should also work. Especially since the vue/html-indent plugin is specifically marked at layout and fixable

Tell us about your environment

  • **ESLint version:5.16.0
  • **eslint-plugin-vue version:5.2.2
  • **Node version:11.9.0

Please show your full configuration:

{
  "name": "eslint-test",
  "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": "^2.6.5",
    "vue": "^2.6.6"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.5.0",
    "@vue/cli-plugin-eslint": "^3.5.0",
    "@vue/cli-service": "^3.5.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "vue-template-compiler": "^2.5.21"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {
        "quotes": [ 2, "single" ],
         "vue/component-name-in-template-casing": [
         1,
         "PascalCase",
         {
            "registeredComponentsOnly": true
         }
      ],
      "vue/html-indent": [
         1,
         "tab",
         {
            "attribute": 1,
            "baseIndent": 1,
            "closeBracket": 1,
            "alignAttributesVertically": true
         }
      ]
    },
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

What did you do?

<template>
    <div id="app">
        <img :alt="Vue logo" src="./assets/logo.png">
        <HelloWorld msg="Welcome to Your Vue.js App"/>
    </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'app',
  components: { HelloWorld, },
    data () {
        return { allum:3,row:'hi',jelly:8 }
    }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

What did you expect to happen?
npx eslint --fix --fix-type layout src/App.vue shoud run and fix only items marked at layout

What actually happened?
Eslint fails to run due to meta of undefined. I have tracked the issue down to the vue/html-indent rule being present. Removing it allows the linter to run and fix issues. npx eslint --fix src/App.vue works, but fixes all issues and is not suitable for legacy code bases. vue/html-indent is marked as fixable and layout, so it should work.

./node_modules/eslint/bin/eslint.js --debug --fix --fix-type layout src/App.vue
  eslint:cli CLI args: [ '--debug', '--fix', '--fix-type', 'layout', 'src/App.vue' ] +0ms
  eslint:cli Running on files +4ms
  eslint:cli-engine Using fix types layout +0ms
  eslint:glob-utils Creating list of files to process. +0ms
  eslint:ignored-paths baseDir = "/home/fvhockney/laut/eslint-test" +0ms
  eslint:ignored-paths addPatternRelativeToCwd:
  eslint:ignored-paths   original = "/node_modules/*"
  eslint:ignored-paths   cooked   = "/node_modules/*" +1ms
  eslint:ignored-paths addPatternRelativeToCwd:
  eslint:ignored-paths   original = "/bower_components/*"
  eslint:ignored-paths   cooked   = "/bower_components/*" +0ms
  eslint:ignored-paths addPatternRelativeToCwd:
  eslint:ignored-paths   original = ".*"
  eslint:ignored-paths   cooked   = ".*" +0ms
  eslint:ignored-paths addPatternRelativeToCwd:
  eslint:ignored-paths   original = "!../"
  eslint:ignored-paths   cooked   = "!../" +0ms
  eslint:ignored-paths Looking for ignore file in /home/fvhockney/laut/eslint-test +0ms
  eslint:ignored-paths Could not find ignore file in cwd +0ms
  eslint:ignored-paths contains: +1ms
  eslint:ignored-paths   target = "/home/fvhockney/laut/eslint-test/src/App.vue" +0ms
  eslint:ignored-paths   result = false +0ms
  eslint:ignored-paths contains: +0ms
  eslint:ignored-paths   target = "/home/fvhockney/laut/eslint-test/src/App.vue" +0ms
  eslint:ignored-paths   result = false +0ms
  eslint:cli-engine Processing /home/fvhockney/laut/eslint-test/src/App.vue +5ms
  eslint:cli-engine Linting /home/fvhockney/laut/eslint-test/src/App.vue +0ms
  eslint:config Constructing config file hierarchy for /home/fvhockney/laut/eslint-test/src +0ms
  eslint:config Using .eslintrc and package.json files +0ms
  eslint:config Loading /home/fvhockney/laut/eslint-test/package.json +1ms
  eslint:config-file Loading package.json config file: /home/fvhockney/laut/eslint-test/package.json +0ms
  eslint:config-file Loading JSON config file: /home/fvhockney/laut/eslint-test/package.json +0ms
  eslint:config-file Loading /home/fvhockney/laut/eslint-test/node_modules/eslint/conf/eslint-recommended.js +8ms
  eslint:config-file Loading JS config file: /home/fvhockney/laut/eslint-test/node_modules/eslint/conf/eslint-recommended.js +1ms
  eslint:config-file Loading plugin:vue/essential +11ms
  eslint:config-file Attempting to resolve eslint-plugin-vue +0ms
  eslint:config-file Loading JS config file: /home/fvhockney/laut/eslint-test/node_modules/eslint-plugin-vue/lib/index.js +1ms
  eslint:config-file Loading /home/fvhockney/laut/eslint-test/node_modules/eslint-plugin-vue/lib/configs/base.js +45ms
  eslint:config-file Loading JS config file: /home/fvhockney/laut/eslint-test/node_modules/eslint-plugin-vue/lib/configs/base.js +0ms
  eslint:plugins Loaded plugin vue (eslint-plugin-vue@5.2.2) (from /home/fvhockney/laut/eslint-test/node_modules/eslint-plugin-vue/lib/index.js) +0ms
  eslint:config Using /home/fvhockney/laut/eslint-test/package.json +68ms
  eslint:config-ops Using config from partial cache +0ms
  eslint:config-ops Apply environment settings to config +0ms
  eslint:config-ops Creating config for environment browser +0ms
  eslint:config-ops Creating config for environment es6 +0ms
  eslint:config-ops Creating config for environment node +0ms
  eslint:linter Linting code for /home/fvhockney/laut/eslint-test/src/App.vue (pass 1) +0ms
  eslint:linter Generating fixed text for /home/fvhockney/laut/eslint-test/src/App.vue (pass 1) +119ms
  eslint:source-code-fixer Applying fixes +0ms
  eslint:source-code-fixer Found fixes to apply +0ms
TypeError: Cannot read property 'meta' of undefined
    at CLIEngine.options.fix.lintResult (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli-engine.js:499:38)
    at Function.SourceCodeFixer.applyFixes (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/util/source-code-fixer.js:122:52)
    at Linter.verifyAndFix (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/linter.js:1050:43)
    at processText (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli-engine.js:197:32)
    at processFile (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli-engine.js:241:12)
    at fileList.map.fileInfo (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli-engine.js:616:40)
    at Array.map (<anonymous>)
    at CLIEngine.executeOnFiles (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli-engine.js:588:34)
    at Object.execute (/home/fvhockney/laut/eslint-test/node_modules/eslint/lib/cli.js:205:111)
    at Object.<anonymous> (/home/fvhockney/laut/eslint-test/node_modules/eslint/bin/eslint.js:78:28)

@fvhockney fvhockney changed the title fail layout fixes with template html-indent causes eslint to fail when fixing only layout issues Apr 4, 2019

@fvhockney

This comment has been minimized.

Copy link
Author

commented Apr 4, 2019

Bump

@fvhockney

This comment has been minimized.

Copy link
Author

commented Apr 4, 2019

It seems that the problem is that in eslint/lib/cli-engine.js from the eslint package, the rule the rule is not being put into the _rulesCache and so the function failes when it tries to read the meta from the rule to find out if it is fixable. making the function bail by forcing a return on no rule works and fixes the issue. At this point I'm not sure if this is something that can be fixed in the vue plugin or if it is something that needs to be addressed by eslint

eslint/lib/cli-engine.js line 497

this.options.fix = lintResult => {
  const rule = this._rulesCache.get(lintResult.ruleId);
  // line I added to bail if no rule found
  if (!rule) return
  const matches = rule.meta && fixTypes.has(rule.meta.type);
  
  return matches && originalFix(lintResult);
}
@fvhockney

This comment has been minimized.

Copy link
Author

commented Apr 4, 2019

After looking at the eslint repo and seaching through their issues, I see that this is actually seems like an issue with the order configs are loaded. They are working on a fix. I have pulled down the branch into the VueCli project and confirmed that this seems to fix the issue.

link to issue

eslint/eslint#11559

link to issue which introduces fix

eslint/eslint#11546

@mysticatea

This comment has been minimized.

Copy link
Member

commented Apr 4, 2019

Hi. I apologize for my overlooking.

As your investigation, The current implementation of --fix-type option doesn't look like to support plugin rules because it caches rules before finding any configs. 😕

We cannot do something in the plugin side...

@fvhockney

This comment has been minimized.

Copy link
Author

commented Apr 4, 2019

No worries. I am just disabling the offending rule when running --fix-type as a temporary work around until eslint/eslint#11546 is merged and released with eslint6

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.