I'm an desktop application developer trying to learn the avalanche of technologies for web programming. I decided to focus with Angular(2-4 whatever) because it seemed like the it might be around for more than a year. I'm taking a course that is focusing on TypeScript right now. I'm using Visual Studio Code (1.14.0 - I just updated it) with TypeScript version 2.4.1 (That's what it shows in the lower right corner).
The instructor is showing us how to 'transpile' with command lines (which was another mess I wasted my morning on - see tsc.cmd as opposed to tsc).
The example in question is simply this one line, the first and only line in the Visual Studio Code editor:
let message = 0;
I get the red line of error under the 'message' telling me that:
[ts] Cannot redeclare block-scoped variable 'message'.
It worked for the instructor (on his MAC) but so did the ts compiler command.
If I change it to
let messag = 0;
The error goes away. I can't find where message is a command, statement or global variable in Type Script.
It seems like I'm running the latest of node and type script. I just worry that something is not correctly installed on my machine.
I am still getting use to the idiosyncrasies of VS Code.
My issue was that I put 'archive' copies of my previous code in a subfolder not realizing that these would be loaded as part of the 'assembly'.
Don't simply close the folder! If you are looking at just a single file, the editor will turn off intellisense for typescript.
My solution was to move my archived files out from under the folder AND rename them so their extension was no longer .ts.
Is it a npm project? If not - make it one and use the features of tsconfig.json, where you can exclude files if necessary. Maybe also use GIT? You could create a template repo (with a default configuration) for cloning and then adding specific stuff.
Related
I have 100+ js files in a directory in atom editor. In chrome console I get errors about many variables not being defined (only the ones I interact with on the page are the ones that show they are undefined), but the error goes away and that portion of js works when I add the var/const/let keyword before those variables.
I now understand that they are implicitly implied variables because throughout the files, some are defined like this (strict mode is on):
foo = bar; // This is an implicitly implied variable
var foo = bar; // This fixes the issue
So the solution is to add var/const/let before those variables, but I am wondering if there is any way to scan the directory of files to point out the implicitly implied variables so I can add var/const/let in front of them?
It is taking very long to navigate through all the files manually scanning for those variables to fix up or navigate the app and wait for the error to show up to fix it one by one.
Any quick solution for this (without disabling strict mode)?
You could use a linter for the directory, which will browse through all the files and raise warnings.
JSHint is a popular one, and it's pretty easy to get going with npm from the command line, or you can install it into your code editor like Atom or Sublime.
The CLI version will be more powerful, you can specify a directory for it to scan, and recursively scan all children. In your code editor, you'll usually only get warnings for the file you currently have open.
I know that I can type into Chrome or FF the following command:
Object.keys(window);
but this displays DHTMLX stuff and also function names in which I'm not interested in. And it doesn't display variables in functions that have not been executed yet. We have more than 20,000 lines of JavaScript codebase, so I would prefer static code analyis. I found JavsScript Lint. It is a great tool but I don't know how to use it for displaying global vars.
So I'm searching for memory leaks, forgotten var keywords, and so on...
To do [only] what you're asking, I think you're looking for this:
for each (obj in window) {
if (window.hasOwnProperty(obj)) {
console.log(obj);
}
}
I haven't linted that code, which is unlike me, but you get the idea. Try setting something first (var spam = "spam";) and you'll see it reported on your console, and not the cruft you asked about avoiding.
That said, JLRishe is right; JSLint executes JavaScript in your browser without "phoning home", so feel free to run it. There are also many offline tools for JSLinting your code. I use a plugin for Sublime Text, for instance.
If you'd like some simplest-case html/JavaScript code to "wrap" JSLint, I've got an example here. Just download the latest jslint.js file from Crockford's repository into the same directory, and poof, you're linting with a local copy of JSLint.js. Edit: Added code in a new answer here.
Though understand that you're linting locally with that wrapper or when you visit JSLint.com. Honestly, I can say with some confidence, Crockford would rather not see our code. ;^) You download JSLint.js (actually webjslint, a minified compilation of a few files) from JSLint.com, but you execute in the browser.
(Admittedly, you're technically right -- you never know when that site could be compromised, and to be completely on the up and up, you sh/c/ould vet jslint.js each time you grab a fresh copy. It is safer to run locally, but as of this writing, you appear safe to use JSLint.com. Just eyeball your favorite browser's Net tab while running some test, non-proprietary code, and see if any phoning happens. Or unplug your box's network cable!)
Rick's answer to use "use strict"; is another great suggestion.
A great way to catch undeclared variables is to add 'use strict' to your code.
The errors will appear in the console, or you could display them in a try ... catch block:
'use strict';
try {
var i= 15;
u= 25;
} catch(ee) {
alert(ee.message);
}
I found a very good solution to list all the global variables with the jsl command line tool:
Here is the documentation
I just have to put /*jsl:option explicit*/ into each file that I want to check. Then it is enough to run ./jsl -process <someFile> | grep 'undeclared identifier'
It is also possible to use referenceFile that contains some intentional global variables /*jsl:import <referenceFile>*/ so these variables will not be listed.
I used a variable called root in a recent JavaScript project, and Sublime Text 3 displayed it like this:
So I'm wondering if there is a root keyword in JavaScript, and if so what does it do... Otherwise I'd like to know a way to stop Sublime Text from displaying it differently... The console, however, says ReferenceError: root is not defined when I type it in there.
root used to be a variable in Node.js however it was deprecated in v6.
UPDATE:
The old URL doesn't work anymore, so I've updated it with the Internet Archive's Wayback Machine's version of it, also here's the merge request with the change.
The declaration comes from this file in Sublime.
UPDATE:
To remove the syntax rule, install PackageResourceViewer as per the instructions here and then open up the JavaScript.sublime-syntax file, find the word root (there's currently only one) and remove it (and the following | character).
Note that you'll need to run Sublime as an administrator on Windows in order to edit the file.
It seems root is not a keyword of javascript:
https://www.w3schools.com/js/js_reserved.asp
I am trying to use TypeScript in a Windows 8 app (html5/JS)
I have looked at the sample app
The app uses a typing definition file for WinJS (WinJS.d.ts).
I need to edit this file as it is not complete. However the file has an interface extension for the Type Element adding a property for winControl(typed to any).
This line gets and error of "Duplicate identifier 'winControl'" I am unable to locate and other place this is.
Also, there are locations in my code that i get errors as there is no property named winControl
To solve this problem you must
remove lib.d.ts from anywhere in your project path (or the path to your winrt.d.ts) folder. It is conflicting with the definitions in your local typescript install folder
make sure that you do not have any of your ts (and JS files) identified as content as they will be copied to your deployment directory and will cause the same duplicate issue (there will be two definitions of everything).
I would suggest opening the output window before you do a build. It will let you see what is causing issues since tcs is being run as a command line behind the scenes for you
Sounds like the same issue that I've experienced when trying to augment the Window interface, a bug that is currently being working on:
http://typescript.codeplex.com/workitem/176
However he only mentions lib.d.ts, you may want to add your problems to the issue to either make sure that it's also being fixed, or to rule out that this is what causes your problem.
I installed JSLint into VS2010. It works great, except that after it gets to line 50 of the file it is checking, it halts with the message JS Lint: Stopping. (37% Scanned).
When I put the same JS into JSFiddle, and use the JSLint tool there...I get a report that spans the entire file. How can I make the JSLint in Visual Studio scan the entire file?
Does it report a validation error on line 50? Perhaps if you could list the content of line 50, somebody may know what feature it does not like.
JSLint unfortunately stops scanning when it comes across a loop with a variable that wasn't defined outside the loop, e.g.
for (var i=0; i < x; i++)
JSLint gets mighty upset if you declare a variable like shown - I think it is to do with the potentially you have not realising that the variable does not have loop scope.
I had a quick play with JSFiddle's JSLint and I could not get it to report anything as an error, so either this doesn't work or it uses an old JSLint, which doesn't include the feature that causes it to stop in Visual Studio. Does it fail when using http://www.jslint.com/?