Configurations in upper folders are always ignored

[redeyes2015]

Tell us about your environment

• ESLint Version: 4.16.0
• eslint-plugin-vue Version: 4.2.0
• Node Version: 6.8.1

Please show your full configuration:

Say, I have this setting: (modified from ESLint configuration cascading example)

your-project
├── .eslintrc.yaml // (A)
└── app
      ├── source.js    
      └─┬ vue_components
        ├── .eslintrc.yaml // (B)
        └─ foo.vue

And in (A), I set

  root: true
  rules:
    semi:
      - error
      - always

In (B):

    extends:
        - plugin:vue/essential

What did you do? Please include the actual source code causing the issue.

In foo.vue:

<script>
console.log(hi)    // no semi
</script>

What did you expect to happen?

ESLint should report error about "Missing semicolon"

What actually happened? Please include the actual, raw output from ESLint.

ESLint considered everything fine and output nothing.

---

I traced the flow of ESLint, and found that the root: true in config/base.js which comes from update-lib-config.js resulting the very config file including "pulgin: vue" would be considered root and thus making ESLint ignore any config file in upper directories. In my example, the config of semi: always is ignored.

Because we are adopting Vue gragually, we want this kind of configuration. A root: false in (B) could work, but I think root: true should be used in the project config file, since providing it from a ESLint plugin only causes confusion. (Maybe ESLint should block this?)

I did search through the issues and did not find reports about this, but if I just missed it, please accept my apology, and close this issue.

[mysticatea]

Thank you for this issue.

Sounds good to me. We have root:true in the base config since the first time, but it seems confusing.
However, the change of configs needs semver-major in our policy, so we consider it on the next major release.

For now, please use root: false.

[dennisreimann]

The only problem with specifying root: false is, that it overrides a potential root:true setting in the projects base config. In this case ESLint will also pick up config files from parent folders beyond the project base folder.

[redeyes2015]

The only problem with specifying root: false is, that it overrides a potential root:true setting in the projects base config.

If you mean specifying root:false in subdirectory like (B), I don't think that is the case.

Say, I have these settings:

~/p/eslint-test $ tree -a
.
├── a
│   ├── b
│   │   ├── .eslintrc.yaml
│   │   └── foo.js
│   └── .eslintrc.yaml
└── .eslintrc.yaml

2 directories, 4 files
~/p/eslint-test $ cat .eslintrc.yaml 
---
    root: true
    rules:
        no-unused-vars:
            - error
~/p/eslint-test $ cat a/.eslintrc.yaml 
---
    root: true
    rules:
        semi:
            - error
            - always
~/p/eslint-test $ cat a/b/.eslintrc.yaml 
---
    root: false
    rules:
        semi:
            - error
            - never

and in foo.js:

var a
console.log('hi')

When a/.eslintrc.yaml has root: true, eslint a/b/foo.js will pass.

After commenting out root: true in a/.eslintrc.yaml, eslint would complain about the unused var a, meaning no-unused-vars specified in the top most .eslintrc.yaml is now included.

So, I would say specifying root: false in subdirectory is safe and does not override the setting in the project base config, unless the base config does not specify root: true.

Hope these make things clear.

[dennisreimann]

Yep, it works as long as you don't have an eslint config in a directory upwards from you project root (i.e. in your home directory).

eslint --print-config a/b/foo.js states root: false (as a/b/.eslintrc.yaml overrides .eslintrc.yaml) and would lead to eslint consuming configs in a parent folder AFAIK.

[redeyes2015]

eslint --print-config is quite useful.

I setup a repository.

There are two folders: root-true and root-false; only
root-true/.eslintrc.yaml includes root: true.

And only ./.eslintrc.yaml has no-unused-vars.

~/p/eslint-test (master) $ eslint --print-config root-true/b/foo.js
{
  "globals": {},
  "env": {},
  "rules": {
    "semi": [
      "error",
      "never"
    ]
  },
  "parserOptions": {},
  "root": false
}
~/p/eslint-test (master) $ eslint --print-config root-false/b/foo.js
{
  "globals": {},
  "env": {},
  "rules": {
    "no-unused-vars": [
      "error"
    ],
    "semi": [
      "error",
      "never"
    ]
  },
  "parserOptions": {},
  "root": false
}

Both report says "root": false, but for root-true case, rule
no-unused-vars is not included, indicating that root: true is in effect and
root-true/.eslintrc.yaml successfully works as a project root config which
stops the configuration from upper folders (i.e. ./.eslintrc.yaml) to be read
in.

But this starts to feel distracting anyway.

I'd like to leave this issue with the original request of removing root: true from eslint-plugin-vue. For anyone concered and/or confused, I suggest you to setup experiments to find whether configs in parent folders might mess in or not.

[dennisreimann]

@redeyes2015 My intention was not to state it as a general problem and I think in 95% of the cases this won't matter.

I'd like to leave this issue with the original request of removing root: true from eslint-plugin-vue.

Yes, perfectly fine as it will also resolve my concern :)

[brianjmiller]

+1, just ran into this based on a setup from the webpack vue template. Passing --debug to eslint makes it very easy to see which configuration files are being considered.