webpack-contrib / eslint-loader Goto Github PK
View Code? Open in Web Editor NEW[DEPRECATED] A ESlint loader for webpack
License: MIT License
[DEPRECATED] A ESlint loader for webpack
License: MIT License
At the moment you cannot change eslint
to for example babel-eslint
.
I can make a pull-request to support it.
I have failOnError and failOnWarning set to false, but when the eslint loader detects errors/warnings, my bundle.js never gets created. My loaders look like this:
{ test: /.jsx$/, exclude: /node_modules|bower_components/, loaders: ["react-hot", "jsx-loader", "babel-loader", "eslint-loader"]}
Not sure if my config is wrong, but I cannot get eslint-loader to output any errors when running webpack-dev-server. I am able to confirm eslint is properly linting by running node_modules/.bin/eslint src/components/Footer/index.js
for example, and I get back results as expected.
Do you see anything here that I'm misconfiguring?
webpack.config.js
, module:
{ preloaders:
[
{ test: /\.css$/
, loader: 'stylelint'
}
,
{ test: /\.jsx?$/
, loader: 'eslint-loader'
, exclude: /node_modules/
}
]
.eslintrc
{
"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"jsx": true
},
"sourceType": "module"
},
"env": {
"browser": true,
"node": true,
"commonjs": true,
"es6": true
},
"plugins": [ "react" ],
"extends": [ "eslint:recommended", "plugin:react/recommended" ],
"rules": { "no-console": 2 }
}
package.json
"eslint": "^2.6.0",
"eslint-loader": "^1.3.0",
"eslint-plugin-react": "^4.2.3",
"webpack": "^2.1.0-beta.4",
"webpack-dev-server": "^2.0.0-beta"
"react": "^15.0.0-rc.2",
npm ERR! peerinvalid The package eslint does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants [email protected] - 0.22
npm ERR! node v0.12.0
npm ERR! npm v2.7.0
npm ERR! code EPEERINVALID
npm ERR! peerinvalid The package eslint does not satisfy its siblings' peerDependencies req.
npm ERR! peerinvalid Peer [email protected] wants eslint@^0.15.0
The way eslint is handling reporter is pretty nice since reporters just use strings (and not directly console.log()
).
I found a simple way to use stylish
by default by removing the line where the filename is (since we use executeOnText()
method, we always have <text>
.
https://github.com/MoOx/eslint-loader/blob/0532fe3ac1af4554c20ef83fcce810048add3b7e/index.js#L34-L37
We can probably (by just using a few lines) add a reporter
option that allow us to choose the reporter to make this loader works with all eslint reporters :)
I had this problem
Summarized:
Getting this:
WARNING in ./app/components/dev/custom.ignored.js /Users/kentcdodds/Developer/alianza/atac5/app/components/dev/custom.ignored.js 0:0 warning File ignored because of your .eslintignore file. Use --no-ignore to override ✖ 1 problem (0 errors, 1 warning)
Any way I can silence that particular warning?
I'm explicitely ignoring that file, so I don't need/want a warning about it...
Just started getting this when I upgraded from 0.19.0 to the latest
Then later, someone mentioned the docs on the subject saying:
Documentation is stating that you shouldn't see this warning when you run eslint on a directory or multiple files, only when you run it on a single file that is being ignored
Is that not what you are seeing?
And, I explained that I'm using the eslint-loader
, to which he responded:
All of the build systems usually do glob patterns first and then run eslint for each file separately
Grunt and Gulp do the same thing
Is there any way that we could get around this without having to quiet
all of our warnings?
$ npm i
npm WARN package.json [email protected] No README data
Hi.
When using eslint-loader either as preloader or as a loader, I am getting this error:
Module build failed: Maximum call stack size exceeded
I am sure it has to do with webpack's resolving stuff, but I have no idea how to resolve it.
If it's any help, this works fine on OSX, not on a Ubuntu system.
Thank you.
Using of "preLoaders+loaders" causes "Module parse failed":
module.exports = {
module: {
preLoaders: [
{test: /\.js$/, loader: "eslint-loader", exclude: /node_modules/}
],
loaders: [
{test: /\.js$/, loader: "babel-loader", exclude: /node_modules/}
]
}
}
ERROR in ./index.js
Module parse failed: ./node_modules/babel-loader/index.js!./node_modules/eslint-loader/index.js!./index.js Line 3: Unexpected token
You may need an appropriate loader to handle this file type.
I have a large app that will be transitioning to es6 over the next few months. Which means I need a different .eslintrc
configuration for the new es6 javascript and the old es5 scripts. I also have a test directory which has a different configuration. Using eslint from the command line the proper configurations are derived according to the directory structure.
Here is a mockup directory structure:
|--- src
|--- content
|--- scripts
|--- es6
|--- .eslintrc
|--- **/*.js <-- (es6 javascript)
|--- test
|--- .eslintrc
|--- **/*Spec.js <-- (javascript unit tests)
|--- **/*.js <-- (es5 javascript)
|--- styles
|--- **/*.less
|--- *.cs (C# files)
|--- .eslintrc
What seems to be happening is that the .eslintrc
file at the root of my repo is the only one getting picked up. Thoughts?
I'm trying to use 2 loaders: babel and eslint
It's ok when i only use babel
Webpack.config.js
...
module: {
loaders: [
{
test: /\.js?$/,
exclude: /(node_modules|bower_components)/,
loader: "babel-loader?presets[]=react,presets[]=es2015"
}
]
},
...
But when i use 2 loaders
...
module: {
loaders: [
{
test: /\.js?$/,
exclude: /(node_modules|bower_components)/,
loaders: ["babel-loader?presets[]=react,presets[]=es2015", "eslint-loader"]
}
]
},
...
i got an error in index.js file
5:17 error Parsing error: Unexpected token <
index.js
var ReactDOM = require('react-dom')
var App = require('./App')
ReactDOM.render(<App />, document.getElementById('root'))
Maybe this is not possible but at the moment whenever eslint throws a warning or error, webpack proceeds to output the whole file list and then shows the errors at the bottom.
Is there anyway to only see eslint's info without webpack's file list dump?
Thanks!
Minor nitpick.
When using webpack with watch: true
, and editing .eslintrc
, I'd have to restart webpack for the new .eslintrc
changes to take effect.
We have two different eslint configuration files. One is intended for production and final builds and the other one is for development purposes and thus less strict (allows console.log for example). The configFile
option doesn't seem to work for me.
folder structure:
/
.dev.eslintrc
webpack.config.js
My webpack config
...
module: {
preLoaders: [
{test: /\.js$/, loader: 'eslint-loader', exclued: /node_modules/}
],
loaders: [
{test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/}
],
eslint: {
configFile: path.join(__dirname, '.dev.eslintrc')
}
}
I would like my webpack build to continue even though ESLint produces failing errors. This will allow me to quickly prototype code.
My webpack config is as follows:
eslint: {
configFile: '.eslintrc',
emitError: false,
}
preLoaders: [{
test: /\.(js|jsx)$/,
loader: 'eslint-loader',
exclude: /(node_modules|bower_components)/
}]
/home/joe/www/frontend/app/modules/account/components/feeds/boxes/facebook-box/facebook-box.jsx
18:63 error Multiple spaces found before '}' no-multi-spaces
✖ 1 problem (1 error, 0 warnings)
100% :
webpack remains on 100% but fails to 'emit'
This doesn't seem to be working for me. I have a lot of shared code between client and server and various .eslintrc files throughout my project, but I need to disable no-console warnings in the server build only. Any idea how to do that?
Hi, first of all, thanks for the great work you did on this useful loader!
I have a project that depends on eslint 0.20.0 and eslint-loader 0.11.0 (see my package.json).
When I do npm install, I get this error:
npm ERR! peerinvalid The package eslint does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants eslint@>= 0.17 <=0.20
Is it a bug, or am I doing it wrong?
Cheers,
Patrick
I stumbled upon #21 (and #40) while using an older version of eslint-loader
(something circa v0.13 / 0.14, right when these features hit).
I've updated both eslint-loader
and eslint
to the latest releases, but it seems webpack is still spewing out warnings for files that eslint proper does not warn about (as it should not warn about, due to .eslintrc
files in the directory tree).
Should this be working as I expect, or is there still some work to be done? The sentiment I got from #21 is that this should be working.
I didn't want to comment on the old issue as I'm not sure how that works out with closed issues.
Possible to have custom reporter support like https://github.com/webpack/jshint-loader does?
i'm not sure if this is an issue with the loader or my whole setup. when watching, if you do a code change that is only a style change, it does not recompile.
using [email protected]
loader setup is:
[
// babel + jsx loader
{
test: /\.jsx?$/,
exclude: /node_modules/,
loaders: [
'babel'
]
},
// eslint loader - needs to be below babel
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'eslint-loader'
},
// json loader
{
test: /\.json$/,
loaders: [
'json'
]
},
// sass loader
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader')
},
// css loader
{
test: /\.css$/,
loader: ExtractTextPlugin.extract('style-loader', 'css-loader!postcss-loader')
},
// added specifically for svg images in css, this will inline them as base64 strings
{
test: /\.(svg)$/,
loader: 'url-loader?limit=100000'
}
],
has anyone else experienced this problem?
eslint-loader takes about 10s to run through 5k lines of js files. This appears to be a combination of:
Is there anything which can be done for these?
Attempting to run webpack-dev-server --inline results in:
ERROR in /usr/local/lib//webpack-dev-server/client?http://localhost:8080/webpack-dev-server/client?http://localhost:8080 1:10-24
Module not found: Error: Cannot resolve module 'eslint' in /usr/local/lib/node_modules/webpack-dev-server/client
@ /usr/local/lib/
ERROR in /usr/local/lib//webpack-dev-server/client?http://localhost:8080/webpack-dev-server/client?http://localhost:8080 3:16-37
Module not found: Error: Cannot resolve module 'eslint' in /usr/local/lib/node_modules/webpack-dev-server/client
@ /usr/local/lib/
ERROR in /usr/local/lib//webpack-dev-server/client?http://localhost:8080/webpack-dev-server/client?http://localhost:8080 2:9-36
Module not found: Error: Cannot resolve module 'eslint' in /usr/local/lib/node_modules/webpack-dev-server/client
@ /usr/local/lib/
Works without --inline or without the eslint preloader
Because of how npm3 puts all modules at the root level unless there's a versioning conflict, peerDependencies
can be moved in the dependencies
section, so that they'll install if they're not already available, but skipped if already installed (matching what the original peer dependency in npm2 and below did)
2.0.0 was just released. Good time to bump. 👍
Package limits eslint version to 0.21.
Would be great to see that updated.
Thanks
To be consistent with eslint.
Should be done before 1.0.
Hi, is it possible to specify location of eslint configuration file from eslint options in webpack?
This is probably not the correct place to be placing this issue but I don't know where to start because there are so many tools involved. Upon updating to Eslint 2 and Webpack 2 I get an error in espree
shown below. With Webpack 1 I don't get this error, and with Webpack 2.0.7.-beta
and Eslint 1.x
I don't get the error as well. If you have any ideas and cold point me in the right direction I'd appreciate it.
{
"parser": "babel-eslint",
"plugins": [
"react"
],
"env": {
"browser": true,
"node": true
},
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"arrowFunctions": true,
"blockBindings": true,
"experimentalObjectRestSpread": true,
"generators": true,
"jsx": true,
"module": true,
"modules": true,
"restParams": true,
"spread": true,
"jsx": true
}
}
}
ERROR in ./src/js/index.js
Module parse failed: /Users/davidfox-powell/dev/frontend-boilerplate/node_modules/babel-loader/index.js?{"presets":["react","es2015","stage-0"],"plugins":["transform-runtime","transform-decorators-legacy","typecheck",["react-transform",{"transforms":[{"transform":"react-transform-hmr","imports":["react"],"locals":["module"]},{"transform":"react-transform-catch-errors","imports":["react","redbox-react"]}]}]]}!/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/eslint-loader/index.js!/Users/davidfox-powell/dev/frontend-boilerplate/src/js/index.js
Cannot read property 'ecmaFeatures' of undefined
You may need an appropriate loader to handle this file type.
TypeError: Cannot read property 'ecmaFeatures' of undefined
at Parser.parseTopLevel (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/espree/espree.js:271:18)
at Parser.parse (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/acorn/dist/acorn.js:1636:17)
at Object.parse (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/acorn/dist/acorn.js:905:44)
at Parser.parse (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/webpack/lib/Parser.js:960:18)
at Module.<anonymous> (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/webpack/lib/NormalModule.js:192:16)
at /Users/davidfox-powell/dev/frontend-boilerplate/node_modules/webpack/lib/NormalModule.js:160:10
at /Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:334:3
at iterateNormalLoaders (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:182:10)
at iterateNormalLoaders (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:189:10)
at /Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:204:3
at Object.context.callback (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:87:13)
at Object.module.exports (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/babel-loader/index.js:89:8)
at LOADER_EXECUTION (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:95:14)
at runSyncOrAsync (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:96:4)
at iterateNormalLoaders (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:200:2)
at iterateNormalLoaders (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:189:10)
at /Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:204:3
at Object.context.callback (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:87:13)
at Object.module.exports (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/eslint-loader/index.js:113:8)
at LOADER_EXECUTION (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:95:14)
at runSyncOrAsync (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:96:4)
at iterateNormalLoaders (/Users/davidfox-powell/dev/frontend-boilerplate/node_modules/loader-runner/lib/LoaderRunner.js:200:2)
@ multi main
Hi,
I am using my loader like this:
loaders: ['babel', 'eslint-loader']
However when the lint has errors it stops babel from running, I'd like to prevent this during dev mode using hot reload and allow the errors though, the devs can use console.log etc during dev but in production I would want the build to actually fail.
Thanks
Looks like peer dependency is up to 0.23 and it's not compatible with recently released 0.24.
Is it possible to generate HTML output of the eslint errors and warnings ? Something similar to eslint-html-reporter which works well with the gulp.
There's something going on with ESLint 2.10.1, eslint-loader, and babel-eslint combination. They had an issue in 2.10.0 that broken eslint-loader and babel-eslint. It was fixed in 2.10.1. It still fails with eslint-loader, though.
I set up an example illustrating this. If you execute npm run test:lint
, the linting process completes successfully. If you run npm start
, you'll start seeing errors like this:
ERROR in ./app/index.jsx
.../react-boilerplate/app/index.jsx
1:1 error Parsing error: The keyword 'import' is reserved
✖ 1 problem (1 error, 0 warnings)
ERROR in ./app/Notes.jsx
.../react-boilerplate/app/Notes.jsx
1:1 error Parsing error: The keyword 'import' is reserved
✖ 1 problem (1 error, 0 warnings)
It's not picking up the parser for some reason. I did try setting
eslint: {
configFile: path.join(__dirname, '.eslintrc')
}
at my common
configuration to make sure it really points to the configuration but this didn't have any effect.
It's possible this is ESLint core issue and that their fix missed some corner case breaking ESLint. I am opening the issue here to see if other users are seeing similar behavior with this particular combination.
Hi id like to activate the ecma feature experimentalObjectRestSpread
. It works with my ide atom, it works when i run eslint. Though it does not work with the webpack loader.
I want something like this to work:
let {first, ...rest} = props;
Sadly only the webpack eslint-loader does not like it..
The following command shows no errors
./node_modules/.bin/eslint --ext .jsx ./src
though my preloader does:
module: {
preLoaders: [
{
test: /\.jsx?$/,
loaders: ['eslint-loader'],
include: APP_DIR
}
], ...
this is my .eslintrc config:
{
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": 6,
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
},
"sourceType": "module"
},
"env": {
"browser": true,
"node": true
},
"plugins": [
"react"
],
"rules": {
"no-console": 0,
"new-cap": 0,
"strict": 0,
"no-underscore-dangle": 0,
"no-use-before-define": 0,
"eol-last": 0,
"quotes": [2, "single"],
"jsx-quotes": 1,
"react/jsx-no-undef": 1,
"react/jsx-uses-react": 1,
"react/jsx-uses-vars": 1,
"react/prefer-es6-class": 2,
"react/no-deprecated": 1
}
}
please help me out!
I'm using this with HMR right now and noticed a couple of things.
In my console, I see things like:
�[90m18:4�[39m �[31merror�[39m 'x' is not defined �[90mno-undef�[39m
In the root of my project some files keep getting made like \033[22m\033[39m
.
I'm guessing these are the terminal colors being sent through and WDS is goofing up? I can try to look into it more later. This is great otherwise, thanks!
The current version of eslint is 0.15.0
. eslint-loader can't use it because the peer dependency is set to: ^0.14.1
.
eslint 0.15.0 release notes here: http://eslint.org/blog/2015/02/eslint-0.15.0-released/
Is there any way to stop these errors being transmitted to the console?
In my webpack.config.js
:
eslint: {
configFile: '.eslintrc',
emitError: true,
emitWarning: true
},
No output is rendered when i purposefully introduce an error.
However, I can see there are indeed errors to report by going against the README:
eslint: {
configFile: '.eslintrc',
emitError: true,
emitWarning: true,
reporter: function(results) {
console.log(stylish.call(this, results));
return stylish.call(this, results);
}
},
webpack: bundle is now INVALID.
<text>
14:0 error 'return' outside of function
✖ 1 problem (1 error, 0 warnings)
Peculiar, eh?
At the moment eslint v1.x is imminent: https://github.com/eslint/eslint/releases which contain various fixes I'm interested in.
At the moment eslint v0.24 is supported: https://github.com/MoOx/eslint-loader/blob/7a73a4c377cc874245da457e389356b058abcd67/package.json#L28
I'm hoping this loader will work with eslint v1.x without any drastic changes.
I would prefer not to have to duplicate my ignore files inside the webpack module loader.
I tried the following to no avail.
eslint: {
configFile: '.eslintrc',
ignoreFile: '.eslintignore',
},
``
The one missing feature that makes this unusable for me is that it doesn't respect my project's .eslintignore file :(. Could we fix that? I may do it myself and send a PR if I have time in the next couple weeks :).
It would be great to support auto fix :)
I'm a newbie to webpack and loaders, so forgive me if my terminology is off or this is a question that has already been answered somewhere else.
I would like to use this loader in conjunction with Travis CI to produce passing/failing builds. So, if there are no lint errors, the build passes. Otherwise it should fail. I can get it to fail by adding the following plugin to my webpack config:
plugins: [
function () {
this.plugin('done', function (stats) {
if (stats.compilation.errors && stats.compilation.errors.length) {
console.log(stats.compilation.errors[0].error);
process.exit(1);
}
});
}
]
This works great, and the Travis build fails. The problem is that it fails after the first file it finds lint errors in. I'd like it to fail after it lints ALL of the files. So that leads me to 2 questions:
Using eslint-loader
with babel-loader
and strict ES6 validation rules fails with lots of errors, since it tries to check code which is transpiled by babel.
To avoid any confusion in loaders ordering, suggest to use preLoaders
section instead.
Could we add a configuration option to only output eslint errors so that the output is essentially the same as calling eslint --quiet
?
/home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:163
if(isError) throw e;
^
Error: callback(): The callback was already called.
at context.callback (/home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:143:11)
at Object.module.exports (/home/sergey/Documents/work/dashboard/node_modules/eslint-loader/index.js:130:7)
at WEBPACK_CORE_LOADER_EXECUTION (/home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:155:71)
at runSyncOrAsync (/home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:155:93)
at nextLoader (/home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:290:3)
at /home/sergey/Documents/work/dashboard/node_modules/webpack-core/lib/NormalModuleMixin.js:259:5
at Storage.finished (/home/sergey/Documents/work/dashboard/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:38:16)
at /home/sergey/Documents/work/dashboard/node_modules/graceful-fs/graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:404:3)
Instead of showing js errors in the console, eslint just crashes. What other logs are needed to help resolve this issue?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.