Visual Studio Code: Difference between revisions

From Bitpost wiki
Line 93: Line 93:
** Copy an .eslintrc.js file from another project into the root of your project.
** Copy an .eslintrc.js file from another project into the root of your project.
* Restart the project, and eslint should prompt you to allow it to be enabled.
* Restart the project, and eslint should prompt you to allow it to be enabled.
See [[eslint|the eslint page]] for more information.

Revision as of 19:23, 18 September 2020

Install

  • Add the repo
curl https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > microsoft.gpg
sudo mv microsoft.gpg /etc/apt/trusted.gpg.d/microsoft.gpg
sudo sh -c 'echo "deb [arch=amd64] https://packages.microsoft.com/repos/vscode stable main" > /etc/apt/sources.list.d/vscode.list'
  • Update as usual
sudo apt-get update
sudo apt-get install code # released monthly
# or code-insiders (released daily)
# use [apt search visualst]
  • Debug > Install additional debuggers... > C++
  • Install the top two CMake packages (one for project mgmt, one for cmake file editing)

Plugins

  • C/C++
  • CMake, CMake Tools
  • eslint
  • Debugger for Chrome
  • GitLens
  • Bookmarks; go F2, set ctrl-F2
  • Numbered bookmarks; go c-1, set c-a-sh-1
  • vscode-icons
  • change-case

Config and Key Bindings

Go to File > Preferences > Settings for a shitton of settings. Search for the name you want.

Turn OFF these very-slow automatic checks in your launch.json file:

   "npm.autoDetect": "off",
   "gulp.autoDetect": "off",
   "grunt.autoDetect": "off",
   "jake.autoDetect": "off",
   "typescript.tsc.autoDetect": "off",

Turn this shit off, it "reuses tabs" on files you open (unless you double-click to open, or edit the file). Nonsense.

"workbench.editor.enablePreview": false

Use the editor; changes are stored and shared across installs from here:

ls ~/.config/Code/User/
keybindings.json -> ../../../development/config/common/home/m/.config/Code/User/keybindings.json
settings.json -> ../../../development/config/common/home/m/.config/Code/User/settings.json

Debugging

While debugging, you can use the Debug Console to print memory, including the content of strings that are clipped by default in the variables and watch windows.

View > Open View > Debug Console

From there, send gdb a command to print memory – 300 characters of a string in this example:

-exec x/300sb Query.c_str()

Code completion and linting

Intellisense

Use CMake to generate json that includes the project headers, then import that into vscode settings, for a DRY way to set up header paths.

  • Add this to CMakeList.txt to generate compile_commands.json:
# MDM This creates compile_commands.json, which can be imported by vscode to set include paths from here, w00t DRY
set(CMAKE_EXPORT_COMPILE_COMMANDS ON)
  • Edit your project settings (eg...)
/home/m/development/thedigitalage/AbetterTrader/server/.vscode/c_cpp_properties.json
  • Add a compileCommands directive:
{
   "configurations": [
       {
           "name": "Linux",
           "includePath": [
               "${workspaceFolder}/**"
           ],
           "defines": [],
           "compilerPath": "/usr/bin/clang",
           "cStandard": "c11",
           "cppStandard": "c++17",
           "intelliSenseMode": "clang-x64",
           "configurationProvider": "vector-of-bool.cmake-tools",
           "compileCommands": "${workspaceFolder}/cmake-debug/compile_commands.json"
       }
   ],
   "version": 4
}

eslint

eslint is the current way to enforce code style in Javascript.

  • Install eslint into your node project (or globally).
npm install --save eslint
  • Install the eslint vscode extension.
  • Configure eslint in one of these ways:
    • Run the vscode command EsLint: Create EsLint configuration
    • Run the [eslint --init] command from the root of your project
    • Copy an .eslintrc.js file from another project into the root of your project.
  • Restart the project, and eslint should prompt you to allow it to be enabled.

See the eslint page for more information.