cferdinandi / kraken

A lightweight, mobile-first boilerplate for front-end web developers.
http://cferdinandi.github.io/kraken
MIT License
806 stars 81 forks source link

gulp jshint not working #263

Closed am3000 closed 7 years ago

am3000 commented 7 years ago

Hey, I was wondering all the time why my scripts aren´t getting linted. I just got errors from the uglifier that were hard to find in the code.

Now I changed gulp.src(paths.scripts.input) to gulp.src('src/js/**/*')

and I´m finally getting the jshint messages.

Please fix in the rep, in a better way than I did ;)

cferdinandi commented 7 years ago

Hey there. I just tested this on my machine with some of my own plugins, and everything worked as expected. As far as I can tell, there's nothing to fix.

Can you share your build (without the gulp.src modification noted above) via a fork?

am3000 commented 7 years ago

Hmm, but isn´t it logical, that src/js/* does not include files in a subfolder like src/js/main/kraken.js

I´m not much of a pro here, but a quick search says the same:

  1. *.scss - The * pattern is a wildcard that matches any pattern in the specified folder. In this case, we’re matching any files ending with .scss in the root folder.
  2. **/*.scss - This is a more extreme version of the * pattern that matches any file ending with .scss in the root folder and any child directories.

from https://zellwk.com/blog/gulp-tutorial-2/

If src/js/* also works for you, that´s a bit strange, isn´t it?

cferdinandi commented 7 years ago

Nope. I don't want EVERY file. I only one immediate subfiles and folders, whichi is why I only use src/js/*. Your version—src/js/*/** grabs every file.

Within my build:scripts, I determine if the file I'm looking at is a js file or a subdirectory. If it's the former, I run my linting and minification tasks. If it's a folder, I first concatenate all of the files within it into a new file (named after the folder itself), and then run the rest of my tasks.

Your approach would, I think, produce individual files AND concatenated versions of them.

see the docs for more info: https://cferdinandi.github.io/kraken/setup.html#working-with-javascript

As I said, if you want to get me a fork, I'm happy to take a look at it. Otherwise, there's not much I can do.

am3000 commented 7 years ago

But your task lint:scripts is run before build:scripts and is not taking subfolders into account. And as far as I can see in build:scripts no linting is being done. I double checked that this is the case in the current https://github.com/cferdinandi/kraken/blob/master/gulpfile.js

cferdinandi commented 7 years ago

No, that's a deferred task that's run through gulp.pipe. It happens async after the stuff is concatenated. I know this is working because I just a ton of linting errors from a third party script yesterday.

Annotated code below.

// This sets up the task to get run AFTER we concatenate
var jsTasks = lazypipe()
        .pipe(header, banner.full, { package : package })
        .pipe(gulp.dest, paths.scripts.output)
        .pipe(rename, { suffix: '.min' })
        .pipe(uglify)
        .pipe(header, banner.min, { package : package })
        .pipe(gulp.dest, paths.scripts.output);

    // Pass in my scripts folder
    return gulp.src(paths.scripts.input)
        .pipe(plumber())
        .pipe(tap(function (file, t) {
            // If the file is a directory, concatenate it's files
            if ( file.isDirectory() ) {
                var name = file.relative + '.js';
                return gulp.src(file.path + '/*.js')
                    // Combines all files in the directory into a single file named after the directory
                    .pipe(concat(name))
                    // NOW run our JS tasks
                    .pipe(jsTasks());
            }
        }))
        // Otherwise, just run the JS tasks on the file
        .pipe(jsTasks());

Since you've refused to provide me with working code I look at, I'm going to close this issue. I'm happy to reopen if you want to give me some code to look at.

am3000 commented 7 years ago

Hey, I really don´t want to troll you, I just want to understand and solve that problem ;) And as for me it´s logical from the code that this does not work for js-files in subfolders, I´d like to have this cleared up. I´ve worked with kraken in three projects now and it all worked, but the linting never did. I just worked around it till now.

///////////////////////////////

I see that jsTasks is run AFTER the concatenation, but where in jsTasks is any linting being started?

I only see the extra task where JS linting is done:

// Lint scripts
gulp.task('lint:scripts', function () {
    return gulp.src(paths.scripts.input)
        .pipe(plumber())
        .pipe(jshint())
        .pipe(jshint.reporter('jshint-stylish'));
});

and this task is only called in the compile task, BEFORE the build:scripts task, where the concatenation is being done.

// Compile files
gulp.task('compile', [
    'lint:scripts', // linting
    'clean:dist',
    'build:scripts', // concatenation
    'build:styles',
    'build:images',
    'build:static',
    'build:svgs'
]);

///////////////////////////////

As I was curious, I just tested this and installed kraken fresh from github. Then I created a file src/js/test.js with errors -> it got linted Then I added an error in src/js/detects/svg.js -> it did NOT get linted

If you test this and it also works for subfolders ... could it be a windows/mac thing, that src/js/* is being interpreted differently on macs?

cferdinandi commented 7 years ago

Totally cool to want to understand how things work, but due to my limited time availability, I need actual code I can look at or I can't help you further.

The linting always works for me. I'm not sure why it's not for you. Looking at actual code would help me figure it out. I'm going to politely step away from this thread until then. Sorry!

am3000 commented 7 years ago

The linting always works for me. I'm not sure why it's not for you. Looking at actual code would help me figure it out. I'm going to politely step away from this thread until then. Sorry!

I totally understand if you don´t have the time. If you find the time, here is the actual code: https://github.com/cferdinandi/kraken/blob/master/gulpfile.js As described above I tested it with your original code in a fresh kraken install.

have a nice day!

cferdinandi commented 7 years ago

You just pointed me to my own code. Can you please share a fork with the actual scripts you're including, as they're included in your src directory? I know what's in my own gulpfile.js. I use it on every project I work on.

am3000 commented 7 years ago

Please read my comments, I tested this with your orignal file as described here:

As I was curious, I just tested this and installed kraken fresh from github. Then I created a file src/js/test.js with errors -> it got linted Then I added an error in src/js/detects/svg.js -> it did NOT get linted If you test this and it also works for subfolders ... could it be a windows/mac thing, that src/js/* is being interpreted differently on macs?

cferdinandi commented 7 years ago

I don't know what JS files you're using, if they should be expected to throw linting errors, how you've got your subfolders structured, etc.

This is pretty simple. Fork, push, share. If you can't or won't do that, I can't help you.