I'm having trouble setting up a JavaScript project in my VSCode.
What I currently have technically "works", but it wont do proper syntax highlighting and syntax error detection. For example, the following code on a fresh file won't show any error:
woosh();
The thing is, there is no function called woosh anywhere (not even in other files). The error is caught only when I try to actually run this code. Does anyone know what I might have done wrong?
VSCode does not highlight JS mistakes like this, because it's not a syntax error; The code above would cause a runtime error.
Install addons like eslint, jshint. If that doesn't work then I recommend learning typescript. It's a superset of javascript with strict type checking. It helps us to catch silly bugs like these.
Related
I am writing Javascript in Visual Studio Code (not Typescript). However, I added "checkJs": true ("Enable type checking on JavaScript files") to my compilerOptions in jsconfig.json to enable automatic imports.
Now that I have done that, I'm getting Typescript errors (squiggly lines), for instance:
JSX element type 'Foo' does not have any construct or call signatures. ts(2604)
I could remove these by disabling validity checking, but then I'd lose normal Javascript validity checking.
My question is: is it possible to have automatic imports, and Javascript validity checking, but not have Typescript errors in VS Code? For instance, is there some flag I can set in jsconfig.json to disable errors with "ts" at the end?
And if not, how do I fix Typescript errors in a Javascript file ... without having to adopt Typescript?
EDIT: Just to help clarify the kind of solution I'm imagining ... let's say we were talking about ESLint here. Yes I could add a comment at the top of a file to make ESLint ignore that file, but then I lose all linting whatsoever.
I'm more looking for the equivalent of being able to say "ts2604": false or "ts*": false in an .eslintrc file, or something more like that. In other words, I don't want to adopt Typescript, or lose all type awareness either ... I just want VS Code's great Javascript features, without large chunks of my code being underlined by error/warning messages that I can't do anything about.
This could be a red herring, but are all your errors JSX related? TypeScript can handle JSX (in *.tsx ot *.jsx files) if you specify the factory to use for the JSX. The error looks like TS can't find the factory class (so it's got <Foo> and doesn't know what to pass it to). Typically this will be something like (the settings say React, but they're the same for Preact or other JSX libraries):
"compilerOptions": {
"jsx": "react",
"jsxFactory": "probably the same as transform-react-jsx setting in your plugins"
}
There's much more on that in the TS docs.
Generally I find it best practice to fix TS errors before JS anyway, but that isn't always practical, so another option is adding // #ts-ignore on the preceding line or // #ts-nocheck to skip type checking in the file.
// #ts-ignore is really intended for this kind of situation, but it's not a long term fix - you're upgrading, you know it works, you just need TS to skip the failing check for now. But, when you know the code works and TS is missing a definition somewhere it can be the right patch.
VS Code's JavaScript type checking is powered by TypeScript. The errors you are seeing in your JS files are not TypeScript language errors, they are the TypeScript engine saying: "Hey this JavaScript code looks like it is invalid". The TypeScript engine tries to understand JavaScript as well as possible, but JavaScript's dynamic nature can sometimes trip it up and you may need to help it along with some JSDoc annotations .
So ideally you should address these errors. If this is not possible, you can suppress the errors using a // #ts-ignore comment on the line above the error (this is offered as a quick fix for the error)
This TypeScript feature request also tracks the ability to suppress specific error codes.
Lately I have been coding in React with Visual Studio Code and we have a team recommandation for using ESLint extension.
It has many configuration capabilities, and the following one may match with your needs :
eslint.probe = an array for language identifiers for which the ESLint extension should be activated and should try to validate the file. If validation fails for probed languages the extension says silent. Defaults to ["javascript", "javascriptreact", "typescript", "typescriptreact", "html", "vue"].
Actually I've two questions, because the common workaround for my initial problem does not work :)
I'm trying to build an Emscripten based library which calls JavaScript functions as described here: https://emscripten.org/docs/porting/connecting_cpp_and_javascript/Interacting-with-code.html#implement-a-c-api-in-javascript
Simply put I just implement my C/C++ code against a C-Function, implement that function in a .js file and 'link' that file using --js-library.
Basically things are working for me except with version EMSDK version 1.38.12 I got a warning when linking the final library:
warning: undefined symbol: foo_
.. which I don't understand but I could just ignore it. In newer versions of EMSDK the behavior changed and the warnings become errors.
Searching for this error you find you can just add -s ERROR_ON_UNDEFINED_SYMBOLS=0 when linking, but this doesn't work (for me) - I still get this error despite I can see this option being added to the linker.
So my questions are:
how do I make -s ERROR_ON_UNDEFINED_SYMBOLS=0 work for me?
and why do I get this warning in the first place? how do I get rid of it?
I`m using phpstorm with protactor for angular and for some reason the IDE doesnt recognize some
functions. but the functions is working fine when i`m running the test.
for example:
element(by.buttonText('toggle')).click();
expect(element(by.css('.net-fade')).getText()).
toEqual('something');
})
The IDE tell me that the method by.css is "unresolved function or method".
Someone know how to fix it?
I'm not familiar with PHPStorm, so this won't be a full-answer:
But I'd say the basic problem is that Protractor binary auto-inserts protractor.js and other dependencies into the environment for you. This is what gives you by (along with other helper variables browser, element, etc).
You may want to insert protractor.js yourself, you can find it in
node_modules/protractor/lib/protractor.js
(And again, I am unsure of how PHPStorm includes files, but you might want to only manually add protractor.js if it is not running in test mode. And to this end, you could set flag in protractors onPrepare() function to check against).
I've noticed recently firebug is starting to throw javascript errors about code that it hasn't before. Such as $ is not defined and also errors with Jquery and processingjs core, which i'm assuming is error free.
Anyone else getting this, and should I just ignore it?
should I just ignore it?
Probably not: Errors in reference libraries like jQuery often stem from their functions being called with incorrect parameters.
It's impossible to say more without details, but it is definitely worth investigating why this happens.
I have a lot of Expected '{' and instead saw 'blah' errors that spit out when I run my scripts through jslint. Is there an option that ignores this error?
There are no options to ignore this unless you edit the source of jslint and remove this particular warning. However, it is highly recommended not to ignore this rule.
no. crocky is a curmudgeon js nazi.;-) there is a vs addin on codeplex that i added an ignore feature to though. the addin is still kinda buggy but works well enough. I haven't been able to get contact with the owner to get on the project so havent put a lot more time into it. anyway see here and get the patch from the patches tab
Actually, with the latest version of sublime-jslint, I just told it to ignore these errors by adding to the "ignore_errors" option:
"ignore_errors":
[
"Expected '{' and instead saw"
],
Now whenever I run sublime-jslint on my files, I get:
jslint: ignored 5 errors.