JavaScript / TypeScript

About

Javascript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions.

While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB, and Adobe Acrobat.

JavaScript is a prototype-based, multi-paradigm, single-threaded, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles.

Installation

Change enable from False to True in the javascript section (cf module installation).

vscode-anywhere:
    javascript:
        enabled: True

You can also take a look at the VSCode-Anywhere javascript module configuration.

For more details read the official documentation for JavaScript and TypeScript.

Requirements

This module doesn’t work out of the box. You must configure eslint (extension dbaeumer.vscode-eslint) for each project for it works properly.

VSCode

VSCode extensions

VisualStudioExptTeam.vscodeintellicode

This extension provides AI-assisted development features for JavaScript/TypeScript.

dbaeumer.vscode-eslint

ESLint support inside VS Code.

This extension doesn’t work out of the box. You must configure it for each project for this extension to work properly.

Please read the documentation.

ESLint

esbenp.prettier-vscode

Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.

eg2.vscode-npm-script

This extension running npm scripts defined in the package.json file and validating the installed modules against the dependencies defined in the package.json.

xabikos.JavaScriptSnippets

This extension contains code snippets for JavaScript in ES6 syntax for Vs Code editor.

leizongmin.node-module-intellisense

This extension autocompletes JavaScript / TypeScript modules in import statements.

christian-kohler.npm-intellisense

This extension autocompletes filenames.

christian-kohler.path-intellisense

This extension autocompletes npm modules in import statements.

msjsdiag.debugger-for-chrome

This extension allows you to debug your JavaScript code in the Chrome browser or any other target that supports the Chrome Debugger protocol.

wix.vscode-import-cost

This extension allow to debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol.

WallabyJs.quokka-vscode

Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type.

sketchbuch.vsc-quokka-statusbar

This extension adds buttons to the status bar in Visual Studio Code (VSC) to control Quokka.

hbenl.vscode-mocha-test-adapter

This extension allows you to run your Mocha tests using the Test Explorer UI.

VSCode settings

Global settings

{
   "eslint.alwaysShowStatus": true,
   "[javascript]":{
      "editor.defaultFormatter":"esbenp.prettier-vscode"
   },
   "[javascriptreact]":{
      "editor.defaultFormatter":"esbenp.prettier-vscode"
   },
   "[typescript]":{
      "editor.defaultFormatter":"esbenp.prettier-vscode"
   },
   "[typescriptreact]":{
      "editor.defaultFormatter":"esbenp.prettier-vscode"
   },
   "[vue]":{
      "editor.defaultFormatter":"esbenp.prettier-vscode"
   }
}

VSCode keybindings

No keybindings.

Software

Windows software

scoop

• nodejs

Linux software

brew

• node

MacOS software

brew

• node

Documentation

• JavaScript
• NodeJS

VSCode-Anywhere

Environment

Windows environment

PATH: "C:\VSCode-Anywhere\apps\scoop\apps\nodejs\current;C:\VSCode-Anywhere\apps\scoop\apps\nodejs\current\bin"

Assuming you have installed in the default directory C:\VSCode-Anywhere.

Specific settings

npm_bin

Path of the npm binary.

• Windows:

vscode-anywhere:
    javascript:
        npm_binary: C:\VSCode-Anywhere\apps\scoop\apps\nodejs\current\npm.cmd

Assuming you have installed in the default directory C:\VSCode-Anywhere.

• Linux /MacOS:

vscode-anywhere:
    javascript:
        npm_binary: /home/linuxbrew/.linuxbrew/bin/npm

npm

Allow manageing npm packages.

• pkgs: name of the packages to install

  • enabled: True to enable, False to skip (default to False)

  • version: the version of the npm package

• opts

opts is not mandatory but allows to pass additional arguments.

Extra args can be arguments described in the Saltstack npm states or can be global Saltstack arguments.

Global opts packages settings:

• npm:pkgs:opts:global: allow passing arguments to all npm packages when installing, updating, or uninstalling a package

• pm:pkgs:opts:install: allow passing arguments to all npm packages when installing a package (cf states.npm.installed)
• npm:pkgs:opts:update: allow passing arguments to all npm packages when updating a package (cf states.npm.installed is also called during the update process)
• npm:pkgs:opts:uninstall: allow passing arguments to all npm packages when uninstalling a package (cf states.npm.removed)

Specific opts packages settings:

• npm:pkgs:<mypkg>:opts:global: allow passing arguments to <mypkg> npm package when installing, updating, or uninstalling the package

• npm:pkgs:<mypkg>:opts:install: allow passing arguments to <mypkg> npm packages when installing the package (cf states.npm.installed)
• npm:pkgs:<mypkg>:opts:update: allow passing arguments to <mypkg> npm packages when updating the package (cf states.npm.installed is also called during the update process)
• npm:pkgs:<mypkg>:opts:uninstall: allow passing arguments to <mypkg> npm packages when uninstalling the package (cf states.npm.removed)

• Windows:

vscode-anywhere:
  javascript:
    npm:
      opts:
        global:
          env:
            - PATH: C:\VSCode-Anywhere\apps\scoop\apps\nodejs\current;C:\VSCode-Anywhere\apps\scoop\apps\nodejs\current\bin
        install: {}
        update: {}
        uninstall: {}
      pkgs:
        eslint:
          enabled: True
          version: null
          opts:
            install: {}
            update: {}
            uninstall: {}
        mocha:
          enabled: True
          version: null
          opts:
            install: {}
            update: {}
            uninstall: {}

Assuming you have installed in the default directory C:\VSCode-Anywhere.

• Linux / MacOS

vscode-anywhere:
  javascript:
    npm:
      opts:
        global: {}
        install: {}
        update: {}
        uninstall: {}
      pkgs:
        eslint:
          enabled: True
          version: null
          opts:
            install: {}
            update: {}
            uninstall: {}
        mocha:
          enabled: True
          version: null
          opts:
            install: {}
            update: {}
            uninstall: {}