Lint-able non-minified scripts

[tateman66]

Hey Guys.
Question for most of you who are much smarter than me ...

Is it possible to get JS from the repository that hasn't been minified in any way? What I'm looking for is something that is both lint-able and complies with the strict declaration within each of the files. The JS in both the dist folder and the js folder have been run through some kind of minification whereby they'd never pass in strict mode anymore - semicolons missing, etc.

So why you ask? Because we use Require to bring in bundles! The Bootstrap JS in there will break your require bundles once they've been run through the optimizer and any modules AFTER a bootstrap bundle will just plan not run. Which in turn makes all your script fail pretty much.

I do my own minification/uglification/pre-processing via grunt so for most 'lib' stuff I want it to be completely pre-processed.

Cool, thanks and let me know if I'm just going about things entirely wrong here. But, I'll never use certain JS plugins from Bootstrap like scroll spy so I want to create my own Require bundles.

Thanks again,
Steven Tate

[mdo]

The JS in our /js folder represents the source JavaScript in Bootstrap. We don't do anything to that until we start concatenating and minifying via Grunt.

[tateman66]

So why would you add a strict mode string then write non strict script?

[cvrebert]

@tateman66 Please elaborate.

[tateman66]

I guess I tend to interchange lint free js and strict js eventhough that's really wrong. Lint obviously complains about whatever you tell it to - semi colons, tabs, globals, unused variables, etc. While strict mode is really preventing other things - evals, withs, etc.

Just curious why the Bootstrap JS devs would choose not to use semi colons in pre-processed js? I was always of the opinion that verbose script (and that's usually lint free script) was a good thing when you certainly know that it will be uglified anyway.

It's not that big of a deal for me but the r.js optimizer doesn't create bundles correctly in conjunction with uglify when semicolons are missing.

I'm just not used to seeing script that looks like this:
var dismiss = '[data-dismiss="alert"]'
var Alert = function (el) {
$(el).on('click', dismiss, this.close)
}

If they're trying to save bits by leaving out semicolons then why not chain assignments there and drop a var?

Steven

[mdo]

It's a stylistic decision, that's all. It's perfectly valid JavaScript, so if your tools are having a problem with it, you should file a bug with them. We've had this discussion in several threads (and other places). Bottom line, it's just how we write it here.

[cvrebert]

Jacob's JS coding style is a tad idiosyncratic in that respect.

[hnrch02]

#3057 might be somewhat relevant.

[tateman66]

Interesting. I'm not really one to get into this debate as I'm perfectly happy forking their code anyway. It's preference. People from Ruby and Python worlds are going to be more comfortable with newline characters and the way they look to them. Unfortunately, I'd say for every 1 experienced js dev who can recognize when a statement ends, there are 99 who don't.

Mark if you guys are still paying attention - any possibility at some future date of taking the jQuery dependency out of all Bootstrap JS and making the modules AMD compliant. Every day IE8 drops a fraction of a percentage in usage we eek closer to a world without jQuery. I obviously love jQuery. And, trying to removing it (and not getting yourself into the jQLite world) will bloat your code by 15% or so. But, to be able to cut that 25k (jQ 2.0) off the pages does have a nice subtle affect on performance.

Cool, thanks guys. We can end this for sure now. I'll keep using semicolons and you guys can obviously keep not using them. :)

Steven

[cvrebert]

We do plan to adopt a JS module system; see also #12783.

[tateman66]

That's cool Chris. Seems like it might be relevant though to do that in conjunction with a non-jquery dependent version where by you can get the module within the function closure rather than through $.fn. A simple AMD example of that would be:

require(['lib/carousel'], function(carousel){
carousel.slide(); // not real examples as carousel becomes more of a static object at this point
carousel.prev();
carousel.next();
});

And code like that could prevent the initial dom query looking for carousels - deferring it to when the AMD closure is ready to go find them. But, only when it asks to.

Would a JQuery-less, IE9+ javascript solution be of any interest to you guys? If so, I wouldn't mind starting a fork in that direction. But, Jacob might be irritated because my code would contain semi-colons. :)

Steven

Again,

[hnrch02]

AFAIK Jacob is rewriting a lot of JavaScript already, but I doubt that he will remove the jQuery dependency.

[cvrebert]

Some folks have clamored for Zepto compatibility, but that's not on the table currently.

Jacob is rewriting a lot of JavaScript already

Eh?

[hnrch02]

I remember @mdo talking about this on some issue. I hope I'm not imaging this, would be pretty embarrassing...

[tateman66]

Well, if you guys can drop IE8 support in some future release or fork it like the JQ folks did with the 1.x line versus the 2.x line, no real reason to have any dependency. Jacob's JS is pretty clean and consistent across all the modules - alerts, carousels, drop downs. It's pretty much constructor, prototype methods, options, then add that to $.fn and do something with a set on dom loaded.

He's even done the work to deal with noConflict and supporting any conflicting properties.
Should take days to get it dependency free. Oh well, just thinking through it as I think the most popular front end stack is going to be Bootstrap and Angular. Angular works pretty well with JQLite and most DOM manipulation can be completely left out except in directives.

Cool, thanks for the decent conversation anyway.

Steven

[mdo]

@hnrch02 As far as I know, he's doing no such thing 😆. All good though.

[hnrch02]

Well then I'll be sitting in the shame corner for the next 24 hours 😅