Eslint-plugin-import: eslint-import-resolver-webpack don't work for resolved paths
.eslintrc
{
"parser": "babel-eslint",
"extends": "airbnb",
"plugins": ["import"],
"settings": {
"import/resolver": "webpack"
},
"env": {
"browser": true
}
}
webpack.config.js
...
resolve: {
root: path.resolve('src'),
extensions: ['', '.js', '.scss'],
modulesDirectories: ['node_modules'],
},
...
src/index.js
import routes from 'routes';
import 'scss/index.scss';
in console:
Error - Unable to resolve path to module 'routes'. (import/no-unresolved)
Error - Unable to resolve path to module 'scss/index.scss'. (import/no-unresolved)
love-intent
All 80 comments
Questions:
- what version of the Webpack resolver?
- is your webpack.config.js a sibling to the nearest ancestor package.json?
- can you provide the whole Webpack config?
benmosher
on 23 May 2016
The test project is placed on https://github.com/must-be-perfect/searchresults/tree/version-0.
It's looks like something is wrong.
love-intent
on 23 May 2016
Nothing obvious at a glance...
benmosher
on 23 May 2016
i am having the same problem.
Using version 0.2.5 of the webpack resolver which is under a directory that's a sibling of package.json
chadi-kazan
on 31 May 2016
Maybe is because airbnb? It also use this module.
love-intent
on 31 May 2016
I am facing the same issue and I have no idea why!
XVincentX
on 31 May 2016
not sure it's coz of that. my eslint config extends google's..
chadi-kazan
on 31 May 2016
Mine is extending airbnb
XVincentX
on 31 May 2016
i have the same issue, versions:
webpack: 1.13.1
eslint-plugin-import: 1.8.1
eslint-import-resolver-webpack: 0.2.5
ChristianHersevoort
on 1 Jun 2016
I just released 0.3.0 of the Webpack resolver yesterday (behind "next" tag).
Can you see if that fixes it? I still don't understand the issue, but that version uses Webpack's actual resolver under the covers.
benmosher
on 2 Jun 2016
Will try asap. Thanks a lot!
XVincentX
on 2 Jun 2016
Actually, just published v0.3.1(tag "next") that has debug logging built in (ref: #300), try calling ESLint from a terminal as follows:
DEBUG=eslint-plugin-import:* $(npm bin)/eslint src/jsx/redux/store.js
I would try linting a single file; the output is pretty verbose but hopefully will identify the issue (or at least disqualify bad config).
benmosher
on 2 Jun 2016
for me is fixed
no, sorry, have the same issue
love-intent
on 2 Jun 2016
Can you run with the debug ENV var set as I described above and paste the output?
benmosher
on 4 Jun 2016
I’m having the same problem. Seems to happen when I use eslint-config-airbnb versions 8.0.0 and 9.0.1
baldurh
on 7 Jun 2016
@benmosher I was having the same issue and after enabling the debug ENV I found that 'eslint-import-resolver-webpack' was failing to resolve the import statements in my webpack.config.js file.
_SyntaxError: Unexpected token import
at Object.exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:513:28)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
at Module.require (module.js:468:17)
at require (internal/module.js:20:19)
at Object.exports.resolve (C:\Dev\PhotosAppnode_moduleseslint-import-resolver-webpack\index.js:56:21)
at v2 (C:\Dev\PhotosAppnode_moduleseslint-plugin-import\lib\coreresolve.js:122:23)
Tue, 07 Jun 2016 13:21:03 GMT eslint-plugin-import:resolver:webpack Using config: {}
Tue, 07 Jun 2016 13:21:03 GMT eslint-plugin-import:resolver:webpack Config path from settings: build/webpack.config.js
Tue, 07 Jun 2016 13:21:03 GMT eslint-plugin-import:resolver:webpack Config path resolved to: C:\Dev\PhotosApp\buildwebpack.config.js
Tue, 07 Jun 2016 13:21:03 GMT eslint-plugin-import:resolver:webpack Error during config lookup: C:\Dev\PhotosApp\buildwebpack.config.js:1
(function (exports, require, module, __filename, __dirname) { import webpack from 'webpack';_
I've "solved" this by creating a dummy web pack with just the resolve.root set.
This has allowed the relative paths to resolve correctly but this isn't really a good option.
Is there some way i can use import * from '*' in my web pack file and have 'eslint-import-resolver-webpack' work with that file?
NorfAlrin
on 7 Jun 2016
If you name the file with.babel.js as its extension, the plugin will use the nearest Babel to pre-compile your config. This should match Webpack's behavior.
benmosher
on 8 Jun 2016
I encountered an issue like this due to the fact that our webpack config was building some absolute paths using path.resolve, which implicitly uses process.cwd().
I fixed the issue by ensuring that the webpack config could resolve all necessary paths regardless of what process.cwd was (by resolving them relative to __dirname).
jsdf
on 9 Jun 2016
Also having this problem with version 0.3.0 and airbnb rules.
I tried jsdf's recommendation of removing any path.resolve references from the config and that didn't work for me.
Here's what my resolve looks like in my webpack.config.js file:
config.resolve = {
root: [client],
alias: {
'css': join(client, 'styles'),
'containers': join(client, 'containers'),
'components': join(client, 'components'),
'utils': join(client, 'utils')
}
};
And here's my .eslintrc:
{
"extends": "airbnb",
"settings": {
"import/resolver": "webpack"
},
"env": {
"browser": true
}
}
johnhforrest
on 22 Jun 2016
@johnhforrest can you install v0.3.1 of the webpack resolver and run eslint in a terminal with
DEBUG=eslint-plugin-import:* eslint [.. one file ..]
It will spit out a bunch of (hopefully useful) debug logging. I recommend that you only run it against one file at a time or it will get lost in a wall of log messages.
benmosher
on 22 Jun 2016
I'm closing this on account of it sortof meandering around.
If any of y'all are able to run with DEBUG=eslint-plugin-import:* and get some output, please open a new specific issue.
benmosher
on 30 Jun 2016
@benmosher here's what I get when I run DEBUG=eslint-plugin-import:* on my app directory...
Cannot find module 'eslint-config-airbnb'
Referenced from: /Users/smkhalsa/code/kundalini-yoga/.eslintrc
Error: Cannot find module 'eslint-config-airbnb'
Referenced from: /Users/smkhalsa/code/kundalini-yoga/.eslintrc
at Object.ModuleResolver.resolve (/usr/local/lib/node_modules/eslint/lib/util/module-resolver.js:75:19)
at resolve (/usr/local/lib/node_modules/eslint/lib/config/config-file.js:479:33)
at load (/usr/local/lib/node_modules/eslint/lib/config/config-file.js:496:24)
at /usr/local/lib/node_modules/eslint/lib/config/config-file.js:392:36
at Array.reduceRight (native)
at applyExtends (/usr/local/lib/node_modules/eslint/lib/config/config-file.js:363:28)
at Object.load (/usr/local/lib/node_modules/eslint/lib/config/config-file.js:530:22)
at loadConfig (/usr/local/lib/node_modules/eslint/lib/config.js:64:33)
at getLocalConfig (/usr/local/lib/node_modules/eslint/lib/config.js:136:23)
at Config.getConfig (/usr/local/lib/node_modules/eslint/lib/config.js:263:22)
smkhalsa
on 11 Jul 2016
@smkhalsa: so looks like there's another problem ATM, with your Airbnb shared config?
benmosher
on 11 Jul 2016
@smkhalsa you might need to run ./node_modules/.bin/eslint instead of just eslint
frodosamoa
on 29 Jul 2016
I solved that problem providing absolute path for webpack config file:
'import/resolver': {
webpack: {
config: path.join(__dirname, 'webpack.config.js')
}
}
Notice that this solution forces to use js format for eslint.
arkaitzgarro
on 2 Aug 2016
I also have the same problem when running eslint from command line. (In Atom I use linter-eslint plugin and everything works fine)
@jsdf 's solutions doesn't work for me either.
Here is what I do
By change
"settings": {
"import/resolver": "webpack"
},
to
"settings": {
"import/resolver": {
"webpack": "webpack.config.js"
}
},
I solved some import/no-unresolved on dependencies installed inside node_modules. But still all resolved paths are not recognized.
Finally I tried the local eslint instead of the global one and everything works fine now. Both in v3.3.0.
So instead of
eslint --config .eslintrc.js .
do
./node_modules/eslint/bin/eslint.js --config .eslintrc.js .
The cause may still be what @jsdf described, but I have to work around in another way.
zhanghaowx
on 19 Aug 2016
@zhanghaowx
"settings": {
"import/resolver": {
"webpack": "webpack.config.js"
}
},
should be
"settings": {
"import/resolver": {
"webpack": {
"config": "webpack.config.js"
}
}
},
sompylasar
on 24 Aug 2016
I've had issues with this plugin, but finally figured out the problem: don't write webpack config in es6 format.
ChristianHersevoort
on 23 Dec 2016
Still experiencing the same issues here with
webpack 2.2.0
eslint 3.14.0
eslint-config-airbnb 13.0.0
eslint-plugin-import 2.2.0
eslint-import-resolver-webpack 0.7.1
I actually moved towards defining the config directly inside .eslintrc:
"settings": {
"import/resolver": {
"webpack": {
"config": {
"resolve": {
"modules": ["apps", "node_modules"],
"alias": {
"shared" : "shared"
}
}
}
}
}
}
neither the alias shared, nor any of the directories inside apps are resolved, node modules, however, do work now.
running
DEBUG=eslint-plugin-import:* node_modules/.bin/eslint apps/news/redux/sagas/feed.js
gives me (only including one of the no-unresolved errors):
...
eslint-plugin-import:resolver:node Resolving: +2ms news/redux/actions/feed from: /Users/irisschaffer/Sites/someProject/apps/news/redux/sagas/feed.js
eslint-plugin-import:resolver:node resolve threw error: +2ms Error: Cannot find module 'news/redux/actions/feed' from '/Users/irisschaffer/Sites/someProject/apps/news/redux/sagas'
at Function.module.exports [as sync] (/Users/irisschaffer/Sites/someProject/node_modules/resolve/lib/sync.js:36:11)
at Object.exports.resolve (/Users/irisschaffer/Sites/someProject/node_modules/eslint-import-resolver-node/index.js:19:28)
at v2 (/Users/irisschaffer/Sites/someProject/node_modules/eslint-module-utils/resolve.js:79:23)
at withResolver (/Users/irisschaffer/Sites/someProject/node_modules/eslint-module-utils/resolve.js:84:16)
at fullResolve (/Users/irisschaffer/Sites/someProject/node_modules/eslint-module-utils/resolve.js:101:22)
at relative (/Users/irisschaffer/Sites/someProject/node_modules/eslint-module-utils/resolve.js:46:10)
at resolve (/Users/irisschaffer/Sites/someProject/node_modules/eslint-module-utils/resolve.js:172:12)
at resolveImportType (/Users/irisschaffer/Sites/someProject/node_modules/eslint-plugin-import/lib/core/importType.js:73:65)
at reportIfMissing (/Users/irisschaffer/Sites/someProject/node_modules/eslint-plugin-import/lib/rules/no-absolute-path.js:14:32)
at EventEmitter.handleImports (/Users/irisschaffer/Sites/someProject/node_modules/eslint-plugin-import/lib/rules/no-absolute-path.js:27:9)
eslint-plugin-import:resolver:webpack Config path from settings: +67ms { resolve:
{ modules: [ 'apps', 'node_modules' ],
alias: { shared: 'shared' } } }
eslint-plugin-import:resolver:webpack Using config: +1ms { resolve:
{ modules: [ 'apps', 'node_modules' ],
alias: { shared: 'shared' } } }
eslint-plugin-import:resolver:webpack enhanced-resolve version: +0ms 3.0.3
eslint-plugin-import:resolver:webpack Error during module resolution: +3ms { Error: Can't resolve 'undefined' in 'news/redux/actions/feed'
at onResolved (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:66:16)
at loggingCallbackWrapper (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at afterInnerCallback (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:138:10)
at loggingCallbackWrapper (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at Resolver.applyPluginsAsyncSeriesBailResult1 (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/tapable/lib/Tapable.js:181:46)
at innerCallback (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:125:19)
at loggingCallbackWrapper (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at Resolver.applyPluginsParallelBailResult1 (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/tapable/lib/Tapable.js:266:46)
at beforeInnerCallback (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:112:19)
at loggingCallbackWrapper (/Users/irisschaffer/Sites/someProject/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
details: 'resolve \'undefined\' in \'news/redux/actions/feed\'',
missing: [] }
/Users/irisschaffer/Sites/someProject/apps/news/redux/sagas/feed.js
(excluding the 5 other ones)
18:8 error Unable to resolve path to module 'news/redux/actions/feed' import/no-unresolved
✖ 6 problems (6 errors, 0 warnings)
Any idea what the problem could be??
irisSchaffer
on 25 Jan 2017
I was having this same issue when upgrading webpack to v2, updating eslint-import-resolver-webpack to 0.8.1 fixed it.
Here is the list of my eslint related package versions:
"webpack": "^2.2.1",
"eslint": "^3.15.0",
"babel-eslint": "^7.1.1",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-plugin-import": "^2.2.0"
wagoid
on 10 Feb 2017
For those who still have this issue, @sompylasar and @ChristianHersevoort solutions solve the problem.
package.json:
"webpack": "^2.2.1",
"eslint": "^3.17.0",
"babel-eslint": "^7.1.1",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-plugin-import": "^2.2.0"
.eslintrc.js:
module.exports = {
parser: 'babel-eslint',
...
extends: ['airbnb-base', 'airbnb-base/legacy'],
plugins: ['react'],
settings: {
'import/resolver': {
webpack: {
config: 'webpack/config/default.js'
}
}
},
rules: { .. }
webpack/config/default.js:
The previous ES5 implementation:
import { resolve } from 'path';
import { CWD, JS_BASE } from '../config';
export default {
entry: '',
output: {
path: '',
publicPath: '',
filename: ''
},
resolve: {
alias: {
routes: resolve(config.CWD, `${config.JS_BASE}/routes`),
pages: resolve(config.CWD, `${config.JS_BASE}/pages`),
components: resolve(config.CWD, `${config.JS_BASE}/components`),
reducers: resolve(config.CWD, `${config.JS_BASE}/store/reducers`),
utilities: resolve(config.CWD, `${config.JS_BASE}/utilities`)
},
extensions: ['/index.jsx', '.jsx', '.js']
}
};
should be rewritten to:
const resolve = require('path').resolve;
const config = require('../config');
module.exports = {
entry: '',
output: {
path: '',
publicPath: '',
filename: ''
},
resolve: {
alias: {
routes: resolve(config.CWD, `${config.JS_BASE}/routes`),
pages: resolve(config.CWD, `${config.JS_BASE}/pages`),
components: resolve(config.CWD, `${config.JS_BASE}/components`),
reducers: resolve(config.CWD, `${config.JS_BASE}/store/reducers`),
utilities: resolve(config.CWD, `${config.JS_BASE}/utilities`)
},
extensions: ['/index.jsx', '.jsx', '.js']
}
};
Why this is happening?
The reason for ESLint resolver is failing on Webpack config written in ES6 syntax, as far as I understood, is that the configuration file should be valid (it gets validated by Webpack once pointed in .eslintrc's settings: { 'import/resolver' }. There is no conversion from ES6->commonJS, therefore configuration file is not considered valid, and resolving fails. Rewriting the configuration file solved the problem for me. Note: if by any chance your Webpack config requires JS files written in ES6 syntax, it will fail as well (you would need to set those files to Webpack's exclude properly).
How to know if this is your issue
Use the command suggested by @benmosher:
DEBUG=eslint-plugin-import:* $(npm bin)/eslint src/path/to/your/file.js
The output should include the whole Webpack configuration object if it is valid (and therefore will be used by eslint import resolver):
...
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack/config/default.js +53ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/.../project/webpack/config/default.js +1ms
eslint-plugin-import:resolver:webpack Using config: { entry: '', // <-- if this line is absent, probably Webpack config is invalid
output: { path: '', publicPath: '', filename: '' },
resolve:
{ alias:
{ routes: '/Users/.../project/src/app/routes',
pages: '/Users/.../project/src/app/pages',
components: '/Users/.../project/src/app/components',
reducers: '/Users/.../project/src/app/store/reducers',
utilities: '/Users/.../project/src/app/utilities' },
extensions: [ '/index.jsx', '.jsx', '.js' ] } } +2ms
...
Thank you for the great tips, guys!
kettanaito
on 5 Mar 2017
Managed to get this working with the following .eslintrc:
...
"settings": {
"import/resolver": "webpack"
}
...
Using the following package versions:
webpack: 1.12.14
eslint: 2.11.1
eslint-import-resolver-webpack: 0.8.1
Hope this helps somebody!
azcn2503
on 14 Mar 2017
Also discovered an interesting thing:
When you have cache: true option regarding ESLint in your Webpack config:
module: {
rules: [
{
/* Validate */
loader: 'eslint-loader',
options: {
failOnError: PRODUCTION,
cache: true // <-- THIS
}
}
]
}
Then ESLint will cache its results (as intended), but also throw resolving errors even after you have setup everything correctly according to this topic. Setting to false fixes the error messages. Just keep that in mind.
kettanaito
on 14 Mar 2017
I've been going crazy over this...
I'm a beginner with webpack and eslint.
My app is working correctly, the paths are understood by webpack.
But eslint is still giving me a few 600 errors, including "unexpected token import" in all my files...
I've tried pretty much every solution presented in this thread and others, including changing my import to require in my webpack config (which turns all import errors to export errors, and has no effect on unresolved path errors)
From what I understand, with settings in .eslintrc I get all "unexpected token import" errors, without settings I only get unresolved paths errors. import/parser doesn't seem to have any effect.
I'm at a loss here so if a charitable soul feels like helping... here's my config:
package.json:
{
...
"dependencies": {
"axios": "0.15.3",
"babel-preset-es2015": "^6.18.0",
"classnames": "2.2.5",
"flag-icon-css": "2.8.0",
"flexboxgrid": "6.3.1",
"input-format": "0.1.3",
"node-sass": "^4.1.1",
"object-assign": "4.1.0",
"react": "^15.4.1",
"react-dom": "^15.4.1",
"react-facebook-login": "3.4.3",
"react-flexbox-grid": "0.10.2",
"react-google-login": "2.6.1",
"react-phone-number-input": "0.6.10",
"react-redux": "4.4.5",
"react-router": "2.8.1",
"react-router-redux": "4.0.6",
"redux": "3.6.0",
"redux-logger": "2.8.1",
"redux-multi": "0.1.12",
"redux-promise-middleware": "4.2.0",
"redux-thunk": "2.1.0",
"sass-loader": "^4.1.1"
},
"devDependencies": {
"autoprefixer": "6.5.1",
"babel-cli": "6.16.0",
"babel-core": "6.17.0",
"babel-eslint": "7.0.0",
"babel-loader": "6.2.5",
"babel-plugin-react-display-name": "2.0.0",
"babel-plugin-react-intl": "2.2.0",
"babel-plugin-transform-react-constant-elements": "6.9.1",
"babel-plugin-transform-react-remove-prop-types": "0.2.10",
"babel-preset-latest": "6.16.0",
"babel-preset-react": "6.16.0",
"babel-preset-react-hmre": "1.1.1",
"babel-preset-stage-1": "6.16.0",
"babel-register": "6.16.3",
"browser-sync": "2.17.5",
"chai": "3.5.0",
"chalk": "1.1.3",
"connect-history-api-fallback": "1.3.0",
"coveralls": "2.11.14",
"cross-env": "3.1.3",
"css-loader": "0.25.0",
"enzyme": "2.5.1",
"eslint": "3.18.0",
"eslint-import-resolver-webpack": "0.8.1",
"eslint-plugin-babel": "4.1.1",
"eslint-plugin-import": "2.0.1",
"eslint-plugin-jsx-a11y": "2.2.3",
"eslint-plugin-react": "6.4.1",
"eslint-watch": "2.1.14",
"extract-text-webpack-plugin": "1.0.1",
"file-loader": "0.9.0",
"html-webpack-plugin": "2.24.0",
"intl": "1.2.5",
"isparta": "4.0.0",
"istanbul": "0.4.4",
"jsdom": "8.5.0",
"json-loader": "0.5.4",
"material-ui": "0.16.6",
"mocha": "3.1.2",
"mockdate": "1.0.4",
"node-sass": "3.10.1",
"npm-run-all": "3.1.1",
"open": "0.0.5",
"postcss-loader": "1.0.0",
"prompt": "1.0.0",
"react": "^15.4.1",
"react-addons-test-utils": "15.3.2",
"react-dom": "^15.4.1",
"react-intl": "2.1.5",
"react-tap-event-plugin": "2.0.1",
"redux-immutable-state-invariant": "1.2.4",
"replace": "0.3.0",
"rimraf": "2.5.4",
"sass-loader": "4.0.2",
"sinon": "1.17.6",
"sinon-as-promised": "4.0.2",
"sinon-chai": "2.8.0",
"style-loader": "0.13.1",
"url-loader": "0.5.7",
"webpack": "1.13.2",
"webpack-bundle-analyzer": "1.5.3",
"webpack-dev-middleware": "1.8.4",
"webpack-hot-middleware": "2.13.0",
"webpack-md5-hash": "0.0.5"
},
...
}
webpack.config.dev.js:
import webpack from 'webpack';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import autoprefixer from 'autoprefixer';
import path from 'path';
export default {
resolve: {
extensions: ['', '.js', '.jsx', '.json'],
root: [
path.join(__dirname,'./src/'),
],
modulesDirectories: [
'node_modules',
],
},
...
};
.eslintrc:
{
"root": true,
"extends": [
"eslint:recommended",
"plugin:import/errors",
"plugin:import/warnings"
],
"plugins": [
"babel",
"react",
],
"settings": {
"import/resolver": {
"webpack": {
"config": "webpack.config.dev.js"
}
}
},
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
}
},
...
}
DEBUG=eslint-plugin-import:* $(npm bin)/eslint src/index.js:
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +4ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +5ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +4ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +4ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +5ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +4ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +4ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +8ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +10ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +2ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +5ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path from settings: webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
/Users/alice/dev/project/src/index.js
1:1 error Resolve error: Unexpected token import import/namespace
1:1 error Resolve error: Unexpected token import import/default
1:1 warning Resolve error: Unexpected token import import/no-duplicates
1:1 warning Resolve error: Unexpected token import import/extensions
1:1 warning Resolve error: Unexpected token import import/no-named-as-default
1:1 warning Resolve error: Unexpected token import import/no-named-as-default-member
1:1 error Resolve error: Unexpected token import import/named
1:1 error Resolve error: Unexpected token import import/no-unresolved
2:19 error Unable to resolve path to module 'react' import/no-unresolved
3:24 error Unable to resolve path to module 'react-dom' import/no-unresolved
5:26 error Unable to resolve path to module 'react-redux' import/no-unresolved
8:30 error Unable to resolve path to module 'material-ui/styles/MuiThemeProvider' import/no-unresolved
9:25 error Unable to resolve path to module 'material-ui/styles/getMuiTheme' import/no-unresolved
10:28 error Unable to resolve path to module 'styles/mui-custom-theme' import/no-unresolved
12:34 error Unable to resolve path to module 'react-tap-event-plugin' import/no-unresolved
15:40 error Unable to resolve path to module 'react-router' import/no-unresolved
16:20 error Unable to resolve path to module './routes' import/no-unresolved
19:8 error Unable to resolve path to module './styles/styles.scss' import/no-unresolved
19:8 warning Unexpected use of file extension "scss" for "./styles/styles.scss" import/extensions
21:19 error Unable to resolve path to module './store' import/no-unresolved
22:38 error Unable to resolve path to module 'react-router-redux' import/no-unresolved
✖ 21 problems (16 errors, 5 warnings)
PS: I haven't dared upgrading to webpack 2, I'm afraid nothing will work anymore :/
alicerocheman
on 21 Mar 2017
@alicerocheman The issue is that your webpack config that you provide to eslint is written not in ES5 (with imports and arrow functions), but eslint only understands ES5. https://github.com/benmosher/eslint-plugin-import/issues/352#issuecomment-284216693
There are two ways to make this work:
- Rewrite webpack config and all of its dependencies in your app to ES5.
- Make Babel do the same (transpile = translate + compile) for you.
I used the second option by having a separate file provided to eslint that requires babel-register to plug in the transpilation and the webpack config and is written in ES5.
sompylasar
on 21 Mar 2017
@sompylasar thank you, I had tried that but made a mistake so it hadn't worked before.
alicerocheman
on 22 Mar 2017
I still have a pb, if you've got a little more time :
there seems to be a problem looking for my webpack config in the wrong place (I've checked, in that module there is a package.json without a "root:true" so I don't know why this is happening)
Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js'
Error: Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object.exports.resolve (/Users/alice/dev/project/node_modules/eslint-import-resolver-webpack/index.js:68:25)
at v2 (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:79:23)
at withResolver (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:84:16)
at fullResolve (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:101:22)
at Function.relative (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:46:10)
at remotePath (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:365:30)
at resolveImport (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:369:16)
at Object.getImport (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:462:68)
at ExportMap.get (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:144:34)
at processBodyStatement (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/rules/namespace.js:77:40)
at Array.forEach (native)
at EventEmitter.Program (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/rules/namespace.js:87:14)
Here's what I get when I try to debug (error at the end) :
DEBUG=eslint-plugin-import:* $(npm bin)/eslint src/index.js
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +534ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +4ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +19ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +10ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +22ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +1ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +2ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +41ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +1ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +2ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +88ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +1ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +15ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +1ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +24ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +46ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +34ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +27ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +329ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +0ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +1ms
eslint-plugin-import:resolver:webpack Config path from settings: ./webpack.config.dev.js +3ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/alice/dev/project/webpack.config.dev.js +1ms
eslint-plugin-import:resolver:webpack Using config: { resolve:
{ extensions: [ '.js', '.jsx', '.json' ],
modules: [ '/Users/alice/dev/project/src', 'node_modules' ] },
devtool: 'cheap-module-source-map',
entry:
[ './src/webpack-public-path',
'webpack-hot-middleware/client?reload=true',
'/Users/alice/dev/project/src/index.js' ],
target: 'web',
output:
{ path: '/Users/alice/dev/project/dist',
publicPath: '/',
filename: 'bundle.js' },
plugins:
[ DefinePlugin { definitions: [Object] },
DefinePlugin { definitions: [Object] },
HotModuleReplacementPlugin { multiStep: undefined, fullBuildTimeout: 200 },
NoEmitOnErrorsPlugin {},
HtmlWebpackPlugin { options: [Object] } ],
module:
{ rules:
[ [Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object],
[Object] ] } } +0ms
eslint-plugin-import:resolver:webpack enhanced-resolve version: 3.1.0 +8ms
eslint-plugin-import:resolver:webpack Error during module resolution: { Error: Can't resolve './styles/styles' in '/Users/alice/dev/project/src'
at onResolved (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:66:16)
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at afterInnerCallback (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:138:10)
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at Resolver.applyPluginsAsyncSeriesBailResult1 (/Users/alice/dev/project/node_modules/webpack/node_modules/tapable/lib/Tapable.js:181:46)
at innerCallback (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:125:19)
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at /Users/alice/dev/project/node_modules/webpack/node_modules/tapable/lib/Tapable.js:283:15
at /Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:38:4
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at afterInnerCallback (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:138:10)
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at Resolver.applyPluginsAsyncSeriesBailResult1 (/Users/alice/dev/project/node_modules/webpack/node_modules/tapable/lib/Tapable.js:181:46)
at innerCallback (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:125:19)
at loggingCallbackWrapper (/Users/alice/dev/project/node_modules/webpack/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
at /Users/alice/dev/project/node_modules/webpack/node_modules/tapable/lib/Tapable.js:283:15
details: 'resolve \'./styles/styles\' in \'/Users/alice/dev/project/src\'\n using description file: /Users/alice/dev/project/package.json (relative path: ./src)\n Field \'browser\' doesn\'t contain a valid alias configuration\n after using description file: /Users/alice/dev/project/package.json (relative path: ./src)\n using description file: /Users/alice/dev/project/package.json (relative path: ./src/styles/styles)\n no extension\n Field \'browser\' doesn\'t contain a valid alias configuration\n /Users/alice/dev/project/src/styles/styles doesn\'t exist\n .js\n Field \'browser\' doesn\'t contain a valid alias configuration\n /Users/alice/dev/project/src/styles/styles.js doesn\'t exist\n .jsx\n Field \'browser\' doesn\'t contain a valid alias configuration\n /Users/alice/dev/project/src/styles/styles.jsx doesn\'t exist\n .json\n Field \'browser\' doesn\'t contain a valid alias configuration\n /Users/alice/dev/project/src/styles/styles.json doesn\'t exist\n as directory\n /Users/alice/dev/project/src/styles/styles doesn\'t exist',
missing:
[ '/Users/alice/dev/project/src/styles/styles',
'/Users/alice/dev/project/src/styles/styles.js',
'/Users/alice/dev/project/src/styles/styles.jsx',
'/Users/alice/dev/project/src/styles/styles.json',
'/Users/alice/dev/project/src/styles/styles' ] } +2ms
@alicerocheman From Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js' which comes from eslint-plugin-import/lib/rules/namespace.js looks like you're trying to edit a file from node_modules/react-phone-number-input but the project's eslint config is applied. Obviously this may fail.
sompylasar
on 22 Mar 2017
@sompylasar I don't understand, you mean the react-phone-number-input tries to do something but can't because of my project's eslint config?
alicerocheman
on 22 Mar 2017
@alicerocheman 'The error at the end' was lost in comment edits so now it's missing from the comment but I managed to remember: it was about a missing file at ./styles/styles when resolved from src of project.
sompylasar
on 22 Mar 2017
@alicerocheman Please describe step by step in details what you're doing. Even obvious steps like typing something into a text editor (and which editor), switching windows etc. Otherwise it's a blind guess.
sompylasar
on 22 Mar 2017
@sompylasar 'The error at the end' is still there, you have to click on the DEBUG line to show the content.
I've defined a root path in my webpack config. This works.
Then I tried solving the eslint errors at my "npm start"
While trying to figure out the eslint errors I also migrated webpack to version 2 (thinking maybe webpack v1 was incompatible with the eslint plugins)
I then finally managed solving the eslint errors problem (thanks to you, yesterday)
Now I'm facing a new error when I launch my app with "npm start" : Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js' error.
I'm just trying to get back to an errorless compilation of my app, basically. So since yesterday I've just corrected some relative paths in my app to simplified paths so that they get resolved with the root path.
I've never meddled with the react-phone-number-input code, I just use the component in my app that's all.
As for my environment, I'm on a Mac, and I develop with Sublime Text 3.
Hope that's the info you need
(as for the "styles" error I corrected it too)
alicerocheman
on 22 Mar 2017
@alicerocheman
Now I'm facing a new error when I launch my app with "npm start" : Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js' error.
- What's executed by 'npm start'?
- From which current directory in the command line do you execute 'npm start'?
sompylasar
on 22 Mar 2017
@sompylasar
1. "start": "npm-run-all --parallel test:watch open:src lint:watch build:langs",
- "test:watch": "npm run test -- --watch",
- "open:src": "babel-node tools/srcServer.js",
(click to see srcServer.js content)
// This file configures the development web server
// which supports hot reloading and synchronized testing.
// Require Browsersync along with webpack and middleware for it
import browserSync from 'browser-sync';
// Required for react-router browserHistory
// see https://github.com/BrowserSync/browser-sync/issues/204#issuecomment-102623643
import historyApiFallback from 'connect-history-api-fallback';
import webpack from 'webpack';
import webpackDevMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
import config from '../webpack.config.dev';
const bundler = webpack(config);
// Run Browsersync and use middleware for Hot Module Replacement
browserSync({
port: 3000,
ui: {
port: 3001
},
server: {
baseDir: 'src',
middleware: [
historyApiFallback(),
webpackDevMiddleware(bundler, {
// Dev middleware can't access config, so we provide publicPath
publicPath: config.output.publicPath,
// These settings suppress noisy webpack output so only errors are displayed to the console.
noInfo: false,
quiet: false,
stats: {
assets: false,
colors: true,
version: false,
hash: false,
timings: false,
chunks: false,
chunkModules: false
},
// for other settings see
// http://webpack.github.io/docs/webpack-dev-middleware.html
}),
// bundler should be the same as above
webpackHotMiddleware(bundler)
]
},
// no need to watch '*.js' here, webpack will take care of it for us,
// including full page reloads if HMR won't work
files: [
'src/*.html'
]
});
- "lint:watch": "npm run lint -- --watch",
- "build:langs": "./node_modules/.bin/babel-node src/utils/translator.js", (used to retrieve all i18n messages from the app for translation)
- I launch this from the "project" directory.
alicerocheman
on 23 Mar 2017
Heres the complete npm start log:
> [email protected] prestart /Users/alice/dev/project
> npm-run-all --parallel start-message remove-dist
> [email protected] remove-dist /Users/alice/dev/project
> rimraf ./dist
> [email protected] start-message /Users/alice/dev/project
> babel-node tools/startMessage.js
Starting app in dev mode...
> [email protected] start /Users/alice/dev/project
> npm-run-all --parallel test:watch open:src lint:watch build:langs
> [email protected] test:watch /Users/alice/dev/project
> npm run test -- --watch
> [email protected] build:langs /Users/alice/dev/project
> babel-node src/utils/translator.js
> [email protected] open:src /Users/alice/dev/project
> babel-node tools/srcServer.js
> [email protected] lint:watch /Users/alice/dev/project
> npm run lint -- --watch
> [email protected] test /Users/alice/dev/project
> env NODE_PATH=$NODE_PATH:$PWD/src mocha tools/testSetup.js "./{,!(node_modules)/**/}*.spec.js" --reporter progress "--watch"
> [email protected] lint /Users/alice/dev/project
> esw webpack.config.* src tools --color "--watch"
[BS] Access URLs:
-------------------------------------
Local: http://localhost:3000
External: http://192.168.1.14:3000
-------------------------------------
UI: http://localhost:3001
UI External: http://192.168.1.14:3001
-------------------------------------
[BS] Serving files from: src
[BS] Watching files...
36 passing (192ms)
webpack: wait until bundle finished: /index.html
webpack: wait until bundle finished: /__webpack_hmr
Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js'
Error: Cannot find module '/Users/alice/dev/project/node_modules/react-phone-number-input/webpack.config.dev.js'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object.exports.resolve (/Users/alice/dev/project/node_modules/eslint-import-resolver-webpack/index.js:68:25)
at v2 (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:79:23)
at withResolver (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:84:16)
at fullResolve (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:101:22)
at Function.relative (/Users/alice/dev/project/node_modules/eslint-module-utils/resolve.js:46:10)
at remotePath (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:365:30)
at resolveImport (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:369:16)
at Object.getImport (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:462:68)
at ExportMap.get (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/ExportMap.js:144:34)
at processBodyStatement (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/rules/namespace.js:77:40)
at Array.forEach (native)
at EventEmitter.Program (/Users/alice/dev/project/node_modules/eslint-plugin-import/lib/rules/namespace.js:87:14)
webpack built cb017de4f1ebd01733ea in 14821ms
webpack: bundle is now VALID.
I guess it must still be the linter because I don't get any error or warning in the log (I should at least get my usual warnings about console logs )...
EDIT : If I uninstall the react-phone-number-input package, eslint works as expected and gives me my usual no-console warnings.
alicerocheman
on 23 Mar 2017
@sompylasar SOLVED! finally ^^
I changed my json .eslintrc into an ES5 .eslintrc.js, and changed the name of the webpack config file into path.resolve(__dirname,"webpack.config.dev.js").
Here's the file (click to open)
const path = require('path');
module.exports = {
"root": true,
"extends": [
"eslint:recommended",
"plugin:import/errors",
"plugin:import/warnings"
],
"plugins": [
"babel",
"react",
],
"settings": {
"import/resolver": {
"webpack": {
"config": path.resolve(__dirname,"webpack.config.dev.js")
}
}
},
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
}
},
"env": {
"es6": true,
"browser": true,
"node": true,
"jquery": true,
"mocha": true,
"commonjs": true
},
...
};
Congrats. It's the linter, eslint-plugin-import for some reason via the namespace rule goes into react-phone-number-input and tries to apply itself there, but it needs the config for that so it goes for the config relatively to the current directory it's working in, not to where it started. This may be a valid bug if not a by-design feature.
sompylasar
on 23 Mar 2017
- eslint-plugin-import's namespace triggers on
import * as something from 'some-module';and dives into 'node_modules/some-module' to find its exports: https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/namespace.md - https://github.com/benmosher/eslint-plugin-import/blob/a69b77181c423043d39f1c8752b296aaa95facfc/resolvers/webpack/index.js#L57-L64 - the resolver uses https://github.com/jsdnxx/find-root to find the closest package.json (which it finds in the installed
react-phone-number-input) and uses that directory as the base for the relative config path.
It looks like a coincidence that namely react-phone-number-input triggers this error. see below.
sompylasar
on 23 Mar 2017
eslint-plugin-import's namespace rule documents 'jsnext:main' as the way it finds ES6 exports in the dependencies, but it also in fact looks at 'module' of package.json https://github.com/benmosher/eslint-plugin-import/blob/a69b77181c423043d39f1c8752b296aaa95facfc/resolvers/webpack/index.js#L208
This was added in this commit: https://github.com/benmosher/eslint-plugin-import/commit/3babc1b5be00181a4690b705fedb687867ac61fa but the documentation wasn't updated.
The 'module' key is present in react-phone-number-input's package.json: https://github.com/halt-hammerzeit/react-phone-number-input/blob/2afb8222e15611df6cd4c100a71b01f74dc92468/package.json#L6
So at least there is a documentation issue for eslint-plugin-import's namespace rule to mention that it looks to both 'jsnext:main' and 'module' keys, at least via the webpack resolver (I didn't check the node resolver code if it matches the behavior).
sompylasar
on 23 Mar 2017
For those who have an ES6 webpack config and don't want to change it back to ES5, you can create a file webpack.config.eslint.js (or any other name actually) with the following content:
// this will compile all the subsequent required files to ES5 on the fly
require('babel-register');
module.exports = require('./webpack.config.js');
"settings": {
"import/resolver": {
"webpack": {
"config": "webpack.config.eslint.js"
}
}
}
asdine
on 5 Apr 2017
@asdine a better solution is to name your actual webpack config webpack.config.babel.js and then webpack and eslint will do the babel transpilation for you.
ljharb
on 5 Apr 2017
@ljharb There are apps which do not use webpack.config.js file; the config is built with a function as a part of the build pipeline, in the middle of the build process. @asdine's solution helps to provide eslint-plugin-import's resolver with the webpack config file even if the way of obtaining a webpack config that is passed to the webpack compiler is different than just require('./webpack.config.js').
sompylasar
on 6 Apr 2017
@sompylasar i'm confused; if the webpack config file is ES6, it should be named ".babel" and everything's automatic. if it's not ES6, it shouldn't need babel-register.
ljharb
on 6 Apr 2017
@ljharb Everything's automatic when everything is default. When you have a custom build pipeline, there may be no webpack config file at all, neither webpack.config.babel.js nor webpack.config.js.
sompylasar
on 6 Apr 2017
I'm very confused what kind of custom build pipeline one would have that utilizes a webpack config, claims to not have a file at all, but then passes a file path to the eslint resolver config?
In other words, if there's no file, then there's nothing to require in https://github.com/benmosher/eslint-plugin-import/issues/352#issuecomment-291967058 - if there is a file, then you can name it .babel.js to avoid needing babel-register.
ljharb
on 6 Apr 2017
There is no other way to configure eslint resolver I know about than to pass the file path. If there is, please tell me. Anyway, for the text editor to use eslint, we have to have a eslintrc (luckily this can be in executable JavaScript, not just static JSON). That file path passed to eslint resolver config is not used by the build pipeline (except for linting), the webpack compiler is called as a function from the build pipeline, and a generated webpack config is passed there.
sompylasar
on 6 Apr 2017
By the way, which module implements the magic .babel.js handling? That's obviously not Node itself, so if my eslintrc is called from Atom Linter it won't have the necessary environment for the magic to happen.
sompylasar
on 6 Apr 2017
That's webpack itself; I'd assume eslint would do it too.
ljharb
on 6 Apr 2017
npm install --save-dev eslint-import-resolver-webpack - resolved the issue!
anisimovyuriy
on 25 May 2017
By the way, which module implements the magic .babel.js handling?
@sompylasar: the Webpack resolver does it to match Webpack proper (which also does it). so it ought to work in any ESLint integration environment.
benmosher
on 25 May 2017
@benmosher ESLint does not rely on Webpack, so does not Atom Linter, so when Atom Linter calls ESLint, there is no Webpack magic built in.
sompylasar
on 25 May 2017
clarification: eslint-import-resolver-webpack implements the aforementioned magic.
So: Atom Linter => ESlint => eslint-plugin-import => eslint-import-resolver-webpack => ✨magic✨
benmosher
on 31 May 2017
resolved by adding the webpack resolver plugin to the eslintrc config and CHANGING in the webpack config files require path in ES5 style.
// webpack.config.dev.js
const path = require('path'); // instead of import path from 'path'
// .eslintrc
"settings": {
"import/resolver": {
"webpack": {
"config": "webpack.config.dev.js"
}
}
}
// package.json
"eslint-import-resolver-webpack": "^0.8.2",
iamgutz
on 23 Jun 2017
I might as well be wrong, but it should be possible to use ES6 syntax with Webpack configuration if you rename it to webpack.babel.js. This should not throw any errors from configuration validation part of eslint's Webpack resolver.
kettanaito
on 23 Jun 2017
@asdine your solution works! Thanks!
iamgutz
on 27 Jun 2017
I'm running into this issue as well, but only when viewing files in Atom.
When I run node_modules/.bin/eslint src/js/app/modules/sectionsPage/containers/SectionTileContainer.js, everything works fine. But in Atom I get import/no-unresolved errors.
If I run DEBUG=eslint-plugin-import:* $(npm bin)/eslint src/js/app/modules/sectionsPage/containers/SectionTileContainer.js I can see the import/resolve fail, but I don't understand why. This is my output (I cut off a bit at the end):
eslint-plugin-import:resolver:node Resolving: +0ms stores/AuthStore from: /Users/bramschulting/projects/web-client/src/js/app/modules/sectionsPage/containers/SectionTileContainer.js
eslint-plugin-import:resolver:node resolve threw error: +4ms Error: Cannot find module 'stores/AuthStore' from '/Users/bramschulting/projects/web-client/src/js/app/modules/sectionsPage/containers'
at Function.module.exports [as sync] (/Users/bramschulting/projects/web-client/node_modules/resolve/lib/sync.js:36:11)
at Object.exports.resolve (/Users/bramschulting/projects/web-client/node_modules/eslint-import-resolver-node/index.js:19:28)
at v2 (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/resolve.js:79:23)
at withResolver (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/resolve.js:84:16)
at fullResolve (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/resolve.js:101:22)
at relative (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/resolve.js:46:10)
at resolve (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/resolve.js:172:12)
at checkSourceValue (/Users/bramschulting/projects/web-client/node_modules/eslint-plugin-import/lib/rules/no-unresolved.js:29:50)
at checkSourceValue (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/moduleVisitor.js:29:5)
at EventEmitter.checkSource (/Users/bramschulting/projects/web-client/node_modules/eslint-module-utils/moduleVisitor.js:34:5)
eslint-plugin-import:resolver:webpack Config path from settings: /Users/bramschulting/projects/web-client/webpack.config.js +0ms
eslint-plugin-import:resolver:webpack Config path resolved to: /Users/bramschulting/projects/web-client/webpack.config.js +1ms
eslint-plugin-import:resolver:webpack Using config: { cache: true,
debug: true,
devtool: 'source-map',
resolve:
{ root: '/Users/bramschulting/projects/web-client',
extensions: [ '', '.js', '.jade' ],
modulesDirectories:
[ 'node_modules',
'src/js/app',
'src/js/vendor_modules',
'tests/mock' ],
alias:
{ environment: '/Users/bramschulting/projects/web-client/src/js/app/config/env/local.js',
byebye: '/Users/bramschulting/projects/web-client/src/js/app/libs/byebye/byebye.js',
q: '/Users/bramschulting/projects/web-client/src/js/app/libs/q.js',
templates: '/Users/bramschulting/projects/web-client/src/templates',
backbone: 'exoskeleton/exoskeleton',
'appboy-web-sdk': 'appboy-web-sdk/appboy.core.min.js',
'react/lib/ReactMount': 'react-dom/lib/ReactMount' } },
...
The line which failes is:
import AuthStore from 'stores/AuthStore';
But that is located in /Users/bramschulting/projects/web-client/src/js/app/stores/AuthStore.js, so the webpack resolve config should be correct, right?
Does anyone have an idea what's going on? This issue is driving me nuts 🔩
bramschulting
on 18 Jul 2017
@bramschulting If you look into the error stacktrace, it is coming from eslint-import-resolver-node, while you expect it to use eslint-import-resolver-webpack. Seems you have configured both, and node takes precedence over webpack.
sompylasar
on 18 Jul 2017
@sompylasar Oh right, thanks! That's due to a config we're extending (airbnb). Is there a way to disable this? I can manually overwrite it, but I'd prefer to disable it (as it's redundant) or 'use' the webpack config for the node resolver. Is that possible?
bramschulting
on 19 Jul 2017
@bramschulting
I use it this way in my .eslintrc.js:
"settings": {
"import/ignore": [
"node_modules",
"\\.(scss|less|css)$",
],
"import/resolver": {
"node": {
"moduleDirectory": [
"./src/webapp",
"./src/api",
"./src/server",
"./src/common",
],
},
"webpack": {
"config": "./webpack/configForEslintImportResolver.js",
},
},
},
@sompylasar yeah I was thinking of this too. But the downside of this is that you still have to define the moduleDirectory in two locations (in .eslintrc and your webpack config).
bramschulting
on 19 Jul 2017
@bramschulting Right. Well, I didn't go extra mile here, but you can require that info from a separate JS file 1) from .eslintrc.js to give the module roots to eslint-import-resolver-node and 2) from the webpack config for the eslint-import-resolver-webpack to give the module roots to it.
sompylasar
on 19 Jul 2017
@sompylasar OK, I'm running into another issue 🙈 I'm getting errors when importing files that have an alias in my webpack config, because the node-resolver tries to resolve them first I think.
I've been looking at this module to figure out where the order is being determined, but I can't seem to find it. Could you give me some pointers? I'd like to make a PR which allows for setting the resolve order, maybe like this:
"import/resolver": {
"order": ["webpack", "node"],
"webpack": {
"config": "webpack/config.js"
}
}
That would fix all the problems I mentioned, right?
bramschulting
on 20 Jul 2017
@bramschulting The order of iterating over the configured resolvers is defined by the Map iteration order: https://github.com/benmosher/eslint-plugin-import/blob/dc3609f895f5ad390d88fd9925dce40960117930/utils/resolve.js#L92-L97
But from the code, the import/resolver config could be an array:
https://github.com/benmosher/eslint-plugin-import/blob/dc3609f895f5ad390d88fd9925dce40960117930/utils/resolve.js#L117-L120
I assume it could look like this, but I haven't tested it:
"import/resolver": [
{
"webpack": {
"config": "./webpack/config.js"
}
},
{
"node": {
"moduleDirectory": [
"whatever"
]
}
}
]
I also recommend to write relative paths explicitly with ./, to make them more visible (also someone reported that the path without ./ didn't work for them, but I doubt this is true).
sompylasar
on 20 Jul 2017
The array shape of import/resolver is not documented, by the way, but that is a documentation issue: https://github.com/benmosher/eslint-plugin-import/blob/ccd93942a0b9f59f1b698672ba167ece1aa9f5f1/README.md#resolvers
CC @benmosher
sompylasar
on 20 Jul 2017
Just wanted to thank @sompylasar for his example of ignoring node_modules. That resolved an issue that broken eslint for us. Thank you!!
gricard
on 1 Jun 2018
@gricard You're welcome!
sompylasar
on 1 Jun 2018
as @arkaitzgarro said, it works for me.
but I didn't use path.
config: path.join(__dirname, 'webpack.config.js')
my .eslintrc.js :
module.exports = {
//... other configs
plugins: [
'vue',
'import'
],
settings: {
"import/resolver": {
"webpack": {
"config": "./build/webpack.base.conf.js"
}
}
},
}
files location:
|-- package.json
|-- .eslintrc.js
|-- build
|-- webpack.base.conf.js
aeolusheath
on 29 Nov 2018
MARK
LittleBreak
on 6 Jun 2019
What did it for me was to move extensions: ['*', '.js', '.jsx'] from module.rules[0].resolve to the root resolve field (in webpack.config.js). .jsx files were problematic.
Before:
resolve: {
alias: {
component: path.resolve(__dirname, 'frontend/component/'),
store: path.resolve(__dirname, 'frontend/store/'),
lib: path.resolve(__dirname, 'frontend/lib/'),
context: path.resolve(__dirname, 'frontend/context/'),
},
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env', '@babel/preset-react'],
plugins: ['@babel/plugin-proposal-object-rest-spread'],
},
},
resolve: {
extensions: ['*', '.js', '.jsx'], // <-- This has to be moved up
},
},
{
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
],
},
After:
resolve: {
alias: {
component: path.resolve(__dirname, 'frontend/component/'),
store: path.resolve(__dirname, 'frontend/store/'),
lib: path.resolve(__dirname, 'frontend/lib/'),
context: path.resolve(__dirname, 'frontend/context/'),
},
extensions: ['*', '.js', '.jsx'], // <-- Here, it works
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env', '@babel/preset-react'],
plugins: ['@babel/plugin-proposal-object-rest-spread'],
},
},
},
{
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
],
},
qbalin
on 21 Jul 2020
@arkaitzgarro
Thank you so much. You solved my one-year problem.
moonjoungyoung
on 29 Jan 2021
Related issues
daltonamitchell
·
3Comments
yutin1987
·
3Comments
pcorpet
·
3Comments
kentcdodds
·
3Comments
tamlyn
·
3Comments
Most helpful comment
I solved that problem providing absolute path for webpack config file:
Notice that this solution forces to use
jsformat foreslint.