VS Code with es6 - visual-studio-code

I am getting the linting error in my code 'import' is only available in ES6 (use 'esversion: 6').
Everything es6 related is throwing an error. Not sure what I have to configure to get it to work.

Add a file named .jshintrc to your project and inside this file type this:
{
"esversion": 6
}
As you can see it here:
The full documentation of jshint options are found here: http://jshint.com/docs/options

Edit: I've added a way to enable es6 if you use ESLint instead of JSHint as well as updating the screenshots since VSCode has changed since my original answer.
JSHint Method:
If you are using JSHint, you can add the following to your settings:
"jshint.options":{
"esversion":6
}
ESLint Method:
If you are using ESLint, you can add the following to your settings:
"eslint.options": {
"env":{
"es6":true
},
"parserOptions": {
"ecmaVersion": 6 // or 7,8,9
}
}
ESLint Configuration Documentation
How to update the settings
Neither JSHint or ESLint are enabled in a fresh version of VS Code, so you'll need to install the extension(s) by going to extensions and then searching for your preferred linter.
In VS Code, head to settings
When the settings display you'll see the settings sections:
Note that there are two sections where you can customize your settings, User Settings and Workspace Settings
User Settings Is where you should apply any global settings you will want for any project you will ever work on.
Workspace Settings Is where you can make settings changes that should only be applied to your current project.
In my case, since I know that only some of my projects can use ES6, I need to have the error hinting to warn me if I'm using ES6 my non-ES6 projects...so I set this only to my Workspace Settings
But, if you know that anything you code in VS Code is going to be an ES6, project, then save a step, and add it to your user settings.
Click on either User/Workspace depending on your preference. Search for JSHint or ESLint (whichever you use). Click on any of the Edit in settings.json links, it doesn't matter which one.
Add the pertinent settings depending on whether you use JSHint or ESLint:
JSHint
ESLint

You can add "esversion": 6 to "jshint.options" in the user settings.
{
"jshint.options": {
"esversion": 6
}
}

Just to round out the excellent suggestions already submitted, you can also set this on a file by file basis by added this escaped line (and similar for other jshint settings) to the top of your file.
// jshint esversion:6
Actually you can add it anywhere, but it only effects subsequent code, allowing you to flip settings on and off if you're desperate to do something weird.

Add the next hint before your code:
/* jshint esversion: 6 */
Example

Make sure, you do the above configurations with the json but also remove/disable the jshint extension for workspace if you're using eslint and vice versa.,

Disable your jshint extension like this:

Related

VSCode 'The file is in the program because: Default library for target 'es3''

I'm using VSCode. After the last update of the IDE, I see this error (Even if I didn't open any project to work on).
I googled it, and I tried several actions according to this link:
https://github.com/microsoft/TypeScript/issues/43838
but none of them seems to work.
Anyone faced the issue? (I'm not using TypeScript in any of my projects and I don't have any tsconfig.ts file). Is it related to one of my VSCode extensions?
It is a general update problem about visual-studio-code with the last update. Issue can be followed from here: https://github.com/microsoft/vscode/issues/168420
Installing JavaScript and TypeScript Nightly extension is helpful for me.
Configure .eslintrc.json in your folder again and reload the vs code
example:
.eslintrc.json file for salesforce
Or
you can refer below link to config your eslint file
https://eslint.org/docs/latest/user-guide/configuring/

I want to use the Babel plug-in: optional-chaining, but the vscode console prompted me incorrectly. How can I solve this problem?

I created a new project with the create-react-app scaffold, and then I wanted to use the optional-chaining plug-in of babel. I installed the package according to the document and configured it, but vscode prompted grammatical errors. What can help me? please.
this is my package.json.
this is the problem:
If you are using CRA there is probably no way instead of ejecting project and applying Babel presets manually (according to https://github.com/facebook/create-react-app/issues/4604).
However, if you are decided to use eject there should be able to add plugin to babel config which is described here https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining. Probably applying stage-0 preset of Babel (https://babeljs.io/docs/en/babel-preset-stage-0) can also be a solution.
Edit: see also Null-safe property access (and conditional assignment) in ES6/2015
The error you are seeing is from Visual Studio Code's built-in JavaScript and/or TypeScript validator. In order to circumvent this, add this to your vscode settings.json file:
"javascript.validate.enable": false
Additionally you can disable the built-in TypeScript validator like this:
"typescript.validate.enable": false
Once those are disabled, eslint will take over and show you the proper errors when applicable.

VSCode Latex-workshop: No AutoBuild for onFileChange

I have a problem with the AutoBuild function in VSCode Latex-Workshop:
Using
"latex-workshop.latex.autoBuild.run": "onFileChange"
the project is not build if I change (and save) my tex-file, even though the Latex Workshop logger tells me:
[10:54:26] File watcher: responding to change in /path/presentation.tex
[10:54:26] Parsing /path/presentation.tex
But nothing more happens.
If I change the settings to
"latex-workshop.latex.autoBuild.run": "onSave"
things work as expected:
[10:59:28] File watcher: responding to change in /path/presentation.tex
[10:59:28] Parsing /path/presentation.tex
[10:59:28] Auto-build /path/presentation.tex upon save.
[10:59:28] BUILD command invoked.
(... building commences ...)
All other settings are kept on default values.
I am using LaTeX-Workshop version 6.0.0
Thank you very much for your help!
Joschua
I experience the same problems with LaTeX Workshop 8.16.1 in vscode 1.54.3.
It is a known problem, see this FAQ.

Stylelint VScode doesn't work

I want to use the css linter "stylelint" on my VScode text editor.
I downloaded the plugin and install it, then I make the "css.validate": false. But i don't have any box that show me error on my CSS files. What can I do ?
If you're getting started with stylelint for the first time, there are two key steps to enable it in Visual Studio Code:
turn off Visual Studio Code's built-in CSS linter and turn on the stylelint extension
create a stylelint configuration object and turn on some rules
You can complete the first step by following the extension usage instructions, mainly changing your Visual Studio Code settings to:
{
"stylelint.enable": true,
"css.validate": false,
"scss.validate": false
}
And the second step by following the configuration documentation on the stylelint website. I believe the quickest means to get started is:
install the recommended config into your project using npm:
npm install --save-dev stylelint-config-recommended
Create a .stylelintrc file that extends the recommended config in the root of your project:
{ "extends": "stylelint-config-recommended" }
This config turns on just the possible error rules. It is a sensible config to start with and build upon. There are over 150 rules built-in to stylelint. You can choose to turn on and configure as many, or as few, as you like to meet your linting needs.
For anyone seeing this and trying to lint other file extensions; note that by default, the extension validates only CSS and PostCSS files.
In order to validate file extensions such as SCSS, you would need to explicitly state so in .vscode\settings.json:
{
"css.validate": false,
"less.validate": false,
"scss.validate": false,
"stylelint.enable": true,
"stylelint.validate": ["css", "scss"]
}

How to disable Ecmascript 6 linting warnings in Visual Studio Code RC5?

I know that this is still a release candidate so it's possible that this functionality doesn't yet exist, but there is a setting for it in the Default Settings:
// Specifies which version of ECMA-Script is used.
"javascript.validate.target": "ES5"
I tried overwriting this in the User Settings by entering:
"javascript.validate.target": "ES6"
but this didn't work. Has anyone had any success with this?
ES6 is not yet supported by the JavaScript language service in VSCode.
You can vote for it, though!
Nowadays this is handled in jshint options, so you should set jshint.options.esversion to 6.