The problem is when you have nested package.json and your top-level .eslintrc uses webpack resolver with defined aliases. In this case you can't import aliased paths inside the files in the nested folder(the one with package.json).
Let me show you the structure:
- router
- package.json
- ClientRouter.js
- ServerRouter.js
- errors
- ApplicationError.js
- .eslintrc.js
- webpack.config.js
- index.js
- package.json
webpack.config.js
const path = require('path');
module.exports = {
resolve: {
alias: {
errors: path.resolve(__dirname, 'errors')
}
}
};
.eslintrc.js
`````` js
module.exports = {
rules: {
'import/no-unresolved': 'error'
},
settings: {
'import/resolver': {
webpack: {
config: './webpack.config.js'
}
}
}
};
.index.js
import ApplicationError from 'errors/ApplicationError'; // everything is fine here, no errors
``````
router/ClientRouter.js
``` js
import ApplicationError from 'errors/ApplicationError'; // ERROR 'import/no-unresolved'
The nested package.json doesn't contain any dependencies. Here's it's contents:
{
"main": "./ServerRouter.js",
"browser": "./ClientRouter.js"
}
You should be able to get around that with an absolute path, i.e.
'import/resolver': {
webpack: {
config: path.join(__dirname, 'webpack.config.js')
}
}
I'd take a PR that keeps looking if a config is not found adjacent to the first package.json, but this behavior is consistent with the README.
Ah, i thought it was looking for webpack config relative to the .eslintrc config, not to the currently linted file. Got it. I think it's good as is, although it forces the user to use js format of the .eslintrc config. Thanks!
Yeah, it's not perfect. Not sure exactly what would be ideal in this case. Glad it's working for you now, though.
Most helpful comment
You should be able to get around that with an absolute path, i.e.
I'd take a PR that keeps looking if a config is not found adjacent to the first
package.json, but this behavior is consistent with the README.