I've been developing a lot of small web development projects in various IDEs, and find myself laboriously typing in jslint configuration headers to silence JSLint. Its warnings and errors are all valid, and I want to keep JSLint in my work cycle, but I spin up 2-3 isolated environments a day, sometimes from generators in Yeoman, other times by hand. These all end up with gripes from JSLint that require the following in every .js file:
/*jslint browser:true*/
/*global require,yada,yada,yada*/
JSHint has a wonderful feature whereby you can declare all these in a parent folder using the body of the .jshintrc file. Does JSLint have something like this? It seems like such an obvious addition, but I can find nothing like this which will work across IDEs (Visual Studio, IntelliJ, Brackets, Sublime Text,...).
I found this for .NET, but I find Visual Studio heavy for projects I might only spend a couple hours on and then throw away (https://jslintnet.codeplex.com/wikipage?title=JSLint.NET%20Settings).
Does someone have some insight on this?
Edit: (See my new answer below.)
I think the quick answer is that setting global settings for every file you JSLint is the job of your IDE or favorite text editor. That is, JSLint is essentially just a big javascript file. It doesn't care about file paths, etc, and won't look for a server-wide config.
I mean, you can change the options used when JSLint is called, but that essentially reduces to the same problem you have now.
So then the question is, if you don't like Visual Studio, what tools do you use? In VS, I've used this tool and liked it a good deal. I think that's different (as in not forked or related, but I could be wrong) than the one you found. In Sublime Text, there are two. I've been using Darren Deridder's, but I get the impression that it's the less popular of the two. Etc etc.
So this isn't a javascript/JSLint question so much as a JSLint wrapper question.
It should be said that JSLint's code is very clean, and it's easy to rig up your own process using Node or something similar. I've done it with JavaScript.NET, though I'd use Node if I was doing it again.
And I'd also suggest you consider keeping the file-by-file JSLint headers. I tend to do so, and it keeps your use "excuses" to a minimum, keeping your code tighter. It's way too easy to get a giant /*global ...*/ header line, for instance, if you have a lot of shared config info. It also means that when someone else uses a "shell" tool different than yours to JSLint your files, you know they're using pretty close to your intended accepted behaviors.
So the literal answer to your question is, "No, JSLint doesn't inherently support a box-wide config file." The longer answer is, "Tell us where you do like to work." ;^)
EDIT: Debated staying out of the usual 'Hint vs. 'Lint discussion, but I will quickly say I like how you're thinking. JSLint is more draconian, but JSLinted code means something more specific than code that's been JSHinted. I won't argue that more specific means better, per se, but I will say that I see JSLint's draconian-ness to be an advantage. It might not be the only way to do something, but there's nothing that Crockford's telling you that's a bad idea, and it's nice to get familiar with those conventions. In the parlance of my times, Crockfords's not wrong, Walter.
EDIT 2: So Brackets looks like it's come a long way since I last used it. Seems to have JSLint by default.
It looks like you can set global JSLint options using the jslint.options setting in your preferences file (and there might be/have been a goal to make that a more interactive UI eventually), like this...
{
"debug.showErrorsInStatusBar": false,
"styleActiveLine": true,
"jslint.options": { "sloppy":true, "white":true, "browser": true }
}
And it does allow settings at the top of the file to override these settings.
This really is approaching a golden age of text editors. I still fall back on VIm a lot, but mainly live VS and Sublime Text, with even jEdit, Coda, and PhpStorm for specific tasks. Looks like this might be my new Sublime for Node & html frontend dev. The quick CSS edit is wonderful, though bindings will complicate it. Thanks!
While the previous excepted answer is an excellent one (and many thanks to its author for making it even better over time!), the world has moved on from JSLint. I'd recommend to anyone reading this very old question that you seriously consider chucking JSLint out of your development cycle in favor of its very effective successor, ESLint. For an even better experience, I'd suggest taking a hard look at the ES7 vs. TypeScript paths, with TSLint being your best option for TypeScript linting.
However, for the development experience that trumps even these modern libraries, go directly for Prettier.js. With Prettier, your linting woes become irrelevant, since Prettier will rewrite your code in an opinionated manner every time it's run.
For the best results with Prettier, add the packages "lint-staged" and "husky" to your dev-dependencies, then add the following in your package.json:
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,json,css,md}": [
"prettier --write",
"git add"
]
},
This will force Prettier's auto-linting behavior to run every time Git's commit command runs.
I can't tell you what a relief using Prettier has been for the front-end development teams and projects I am responsible for. We've gone from code reviews bleeding with linting correction comments to zero almost immediately. Feedback from the teams has been universally positive.
The only modification I've made has been to the tabs-vs.-spaces setting. I've modified my .prettierrc.json file to select tabs instead of spaces, because use of spaces at different widths causes dirty git merge histories. You can't control the indentation of 250+ developers spread over multiple hemispheres, some of whom drop in and out of the project before you even know their names. So, setting tabs as the default indentation allows all of the developers to operate with the indentation they're comfortable with without modifying lines in Git. Here's my .prettierrc.json file, with some other slight modifications:
{
"arrowParens": "always",
"bracketSpacing": false,
"singleQuote": true,
"useTabs": true,
"trailingComma": "none"
}
Related
Is there a way to avoid working with the command-line installing and using LESS??
There are several offers for GUIs for the compiling-phase, but I did not find a way for the Installation-Phase.
I have been working in the IT-business for so many decades (more in the mainframe and midrange area and as a project-manager and programmer in the application development) and could by now avoid to go as far down to the command-line-world.
I did develop quite fine Websites using HTML5 and CSS3 and doint this I felt a desire for all that, what LESS and/or SASS are offering and the Syntax and logics dont look difficult to handle. But I fail in the first step of just installing it.
The LESS-Website offers command-lines to key in. But I am not sure, if this will be all I have to key in, but only the significant line to be embedded in a sequence of other commands very familiar to all those working at this Level.
How do I e.g. define the place to store the Installation and to refer to in the href in the link-Statement of my html-file .... ??
Thanks
Gerhard (from Vienna/Austria, living in Trier, Germany)
Less is a CSS pre-processor. if you are include less.js in you html page
You can use less directly in to your html page.
Other ways you can use less compiler
Kola this is an open source application it will help you to compile less to css
Your Topics are clear to me. I even downloaded Koala already and I have no Problem in including less.js in my html. And I have read Bass Jobsens book about the Syntax, which does not seem to raise great Problems to me.
But before working with it, I will have to download LESS -what I have done from the Less-Website to the Folder of my choice. My Problem is the next necessary step: To install this downloaded program. There is no install.exe or something like that. The book as well as the info in the less-Website tell me to key some crpytic commands into the command-line.
Recently, I've noticed strange behavior by Subversion. Occasionally, and seemingly randomly, the "svn up" command will wreak havoc on my CSS files. 99% of the time it works fine, but when it goes bad, it's pretty damn terrible.
Instead of noting a conflict as it should, Subversion appears to be trashing all incoming conflict lines and reporting a successful merge. This results in massively inconvenient manual merges because the incoming changes effectively disappear unless they're manually placed back into the file.
I would have believed this was a case of user error, but I just watched it happen. We have two designers that frequently work on the same CSS files, but both are familiar and proficient with conflict resolution.
As near as can figure, this happens when both designers have a large number of changes to check in and one beats the other to the punch. Is it possible that this is somehow confusing SVN's merging algorithm?
Any experience or helpful anecdotes dealing with this type of behavior from SVN are welcome.
If you can find a diff/merge program that's better at detecting the minimal changes in files of this structure, use the -diff-cmd option to svn update to invoke it.
It may be tedious but you can check the changes in the CSS file by using
svn diff -r 100:101 filename/url
for example and stepping back from your HEAD revision. This should show what changes were made , at what revision and by whom. It sounds like a merging issue I've had before but unfortunately I found myself resolving it by looking at previous revisions and merging them manually too.
I'm looking at requiring my team to document their code more thoroughly for some major upcoming projects and to make life a little less painful, I am steering towards XML documentation generators such as Sandcastle, Doxygen or Box Live Documenter.
What are the key considerations I should keep in mind when evaluating the best option and what experiences have led you to a particular decision?
For me the key considerations would be:
Fully automated: Can it be set up in such a way so that pretty much
no outside work is required to
create or edit the documentation.
Fully styled: Can the documentation be fully styled so
that it looks great in a wiki or pdf
after it’s generated. I should be
able to change colors, font sizes,
layouts, etc.
Good Filtering: Can I select only the items I want to be
generated. I should be able to
filter the namespaces, file types,
classes, etc.
Customization: Can I include headers, footers, custom elements,
etc.
I found Doxygen could do all of this. Our workflow is as follows:
Developer makes a change to the code
They update the documentation tags right above the code they just changed
We click a generate button
Doxygen will then extract all the XML documentation from the code, filter it to only include the classes and methods we want, and apply the CSS styling we’ve pre-made for it. Our end result is an internal wiki that looks the way we want, and doesn’t require editing.
Extra: We have all our projects in various git repositories. We pull all these down to one root folder and generate the docs form this root folder..
Would be interested to know how others are automating even further..?
Who is paying for the documentation and why? (is the system stable enough, does it add enough value)
Who is going to read it, and why is she not using a more effective communication channel?
(if correct mostly distance in time/place)
Who is going to keep it up to date.
When are you going to destroy it? (Automatically if it hasn't been read or updated in the past three months?)
I mostly prefer better code to make my life less painful, over more documentation, but I like scenario & unit tests and a high level architecture description.
[edit] Documentation costs time and money to write and keep up to date. JavaDoc style documentation has a serious detrimental effect on the amount of code simultaneously visible and might be a good idea for the developers using the code, but not for those writing it.
Just found StyleCop, looks like something worth using for my projects. Then I found out you could use it with ReSharper (a tool I've also never used). So I downloaded ReSharper, as well as StyleCop for ReSharper. I'm just a bit confused about it, though:
With just StyleCop installed (no ReSharper), I get yelled at for referring directly to private variables in code-behind. It wants me to instead do this.variable. Alright, fine.
If I use just ReSharper, it tells me to remove all of the 'this' calls I just added. Which one is better?
If I use ReSharper + StyleCop for ReSharper, it now tells me to add 'this' to all private member references (just like StyleCop did all by itself). However, now it also wants me to add 'this' to all of the controls I'm referencing from the .aspx page (i.e., Label.Text = this.variable -> this.Label.Text = this.variable).
I'm so confused. What is the best standard to follow? Or am I just fine doing it the way I am now (Label.Text = variable)?
The key point is consistency. Your particular formatting with regard to this point comes down to personal preference.
Does the extra wordiness provide additional clarity as to which variable you're referencing or does it obscure the meaning by flooding the page with extra text?
This is a judgment call. They do enforce other rules that make sense; however, a large part of what they do is enforce consistency. As #Martin said, feel free to disable rules that don't make sense for your workflow.
Sorry when working on a team it all comes down to understanding the politics; after all, we work to get paid!
If the person that decided your next
pay raise uses StyleCop, then you
should always include the “this.”
likewise if the boss uses ReSharper
you should do what ReSharper says.
There are a lot more important wars to win this, e.g. 10,000 line classes, over sized method
If you are luckly enough to decide what tools (and coding standards) are used yourself, then I would just choose ReSharper and read the “clean code” book.
I think it's up to you which conventions you want to follow (it's a matter of personal preferences). At least in ReSharper, you can edit the rules to no longer show certain warnings/hints.
I'm in the process of taking a couple of separate asp.net applications, and combining them.
One problem is rationalizing the CSS between the two app - app1 has two css files, while app2 has about 8 of them. Much of the CSS between the two apps is the same, but there are some differences. I'm looking for a tool to compare all the elements of each app, and show what's missing, what's different, etc. Ideally the output would be 3 files: Common, app1 and app2, but I won't be that fussy if it can just show me the differences between the two apps.
Does such a tool exist?
If you hate downloading tools, there's an online version of css comparer here http://www.alanhart.co.uk/tools/compare-css.php
It provides a comparison of css class files between two files
I don't know of a stand-alone tool tailored for this specific purpose. There's a PHP class called "CSS Comparer", but I have no idea how easy it is to use. The screenshot on that page looks promising though.
Personally, I would probably just concatenate all the files together, so that you have one file for each app, and then run a diff on them. To make it even easier, you could run both files through something like CSSTidy or do some imaginative file processing with search/replace and sorting. That could get all the declarations in the same order in both files, so the diff would be clearer.
Combine all of these files into a single file and give it a run through a CSS optimizer or compressor. An optimizer should see all of your duplicate selectors and weed them out.
I'd recommend YUI's compressor, but there are plenty of web-based compressors/optimizers available, too. Here's one and another. YMMV with them, but a good Google search can turn up a bunch more.
Normally I'd recommend diff. Since you explicitly write that you are looking for something "not diff based", maybe you could describe why diff does not help you.
Then others might be able to propose something different.