VS Code Setup

Set up Java

Install Java JDK

sudo apt install default-jdk

Install Gradle

sudo add-apt-repository ppa:cwchien/gradle
sudo apt update
sudo apt install gradle

In Visual Studio install the Maven for Java and Gradle Tasks

Typescript

Install usual code but add the following to the setting for typescript. Search typescript in settings and change to json in settings.json. Dont forget to restart

"typescript.tsserver.experimental.enableProjectDiagnostics": true,

List of extensions

angular.ng-template-0.1001.0
dbaeumer.vscode-eslint-2.1.13
ecmel.vscode-html-css-0.2.3
eg2.vscode-npm-script-0.3.13
esbenp.prettier-vscode-5.7.1
gitlab.gitlab-workflow-3.6.0
golang.go-0.18.0
ivory-lab.jenkinsfile-support-1.1.0
janjoerke.jenkins-pipeline-linter-connector-1.2.0
johnpapa.angular2-9.1.2
johnpapa.angular-essentials-9.0.1
johnpapa.vscode-peacock-3.8.0
johnpapa.winteriscoming-1.4.3
maelvalais.autoconf-0.1.0
mikael.angular-beastcode-10.0.3
msjsdiag.debugger-for-chrome-4.12.11
msjsdiag.debugger-for-edge-1.0.15
ms-python.python-2020.10.332292344
ms-python.python-2020.9.114305
ms-vscode.cpptools-1.0.1
ms-vscode.vscode-typescript-tslint-plugin-1.2.3
nicolasvuillamy.vscode-groovy-lint-1.2.9
nrwl.angular-console-14.0.1
pkief.material-icon-theme-4.3.0
pranaygp.vscode-css-peek-4.0.0
richardwillis.vscode-gradle-3.5.2
vscjava.vscode-maven-0.25.0
xaver.clang-format-1.9.0
zignd.html-css-class-completion-1.19.0

Set up GO

Install the GO extension and tools
For Gitlab create directory

mkdir -p ${GOROOT}/src/gitlab.com/<username>

Make a config, the default with program changed to ${workspaceRoot}

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch",
            "type": "go",
            "request": "launch",
            "mode": "auto",
            "remotePath": "",
            "port":2345,
            "host": "127.0.0.1",
            "program": "${workspaceRoot}",
            "env": {},
            "args": [],
            "showLog": true
        }
    ]
}

Set up Prettier

Install

sudo npm -g i prettier

Change vscode settings

{
    "prettier.semi": false
}

Change .vsocde/settings.json

{
    "prettier.semi": false
}

Change package settings in package.json. I think this is because it is broken

  "prettier": {
    "singleQuote": true,
    "semi": false
  }

Change package.json to run prettier

  "scripts": {
...
    "format": "prettier --write '**/*.{ts,js,css,html}'"
  },

Set up .prettierignore to ignore directories

build
coverage
dist

Other things

Web Server Setup

Install lws web server which is a better option than the default

sudo npm  i -g local-web-server

To get the famous green tick

cd /usr/local/lib/node_modules/local-web-server/node_modules/lws/ssl
sudo mv private-key.pem private-key.pem.old
sudo mv lws-cert.pem lws-cert.pem.old
sudo ln -s <your cert>/server.key private-key.pem
sudo ln -s <your cert>/server.crt lws-cert.pem

pwa setup angular

ng add @angular/pwa

Add this to your index.html

<meta name="Description" content="Put your description here.">
<link rel="apple-touch-icon" href="/assets/icons/icon-192x192.png"/>

Add this to tsconfig.app.json

"angularCompilerOptions": {
  "enableIvy": true
}

tslint setup

Just a current version for reference

{
  "extends": "tslint:recommended",
  "rulesDirectory": [
    "codelyzer"
  ],
  "rules": {
    "align": {
      "options": [
        "parameters",
        "statements"
      ]
    },
    "array-type": false,
    "arrow-return-shorthand": true,
    "curly": true,
    "deprecation": {
      "severity": "warning"
    },
    "eofline": true,
    "import-blacklist": [
      true,
      "rxjs/Rx"
    ],
    "import-spacing": true,
    "indent": {
      "options": [
        "spaces"
      ]
    },
    "max-classes-per-file": false,
    "max-line-length": [
      true,
      140
    ],
    "member-ordering": [
      true,
      {
        "order": [
          "static-field",
          "instance-field",
          "static-method",
          "instance-method"
        ]
      }
    ],
    "no-console": [
      true,
      "debug",
      "info",
      "time",
      "timeEnd",
      "trace"
    ],
    "no-empty": false,
    "no-inferrable-types": [
      true,
      "ignore-params"
    ],
    "no-non-null-assertion": true,
    "no-redundant-jsdoc": true,
    "no-switch-case-fall-through": true,
    "no-var-requires": false,
    "object-literal-key-quotes": [
      true,
      "as-needed"
    ],
    "quotemark": [
      true,
      "single"
    ],
    "semicolon": {
      "options": [
        "never"
      ]
    },
    "space-before-function-paren": {
      "options": {
        "anonymous": "never",
        "asyncArrow": "always",
        "constructor": "never",
        "method": "never",
        "named": "never"
      }
    },
    "typedef": [
      true,
      "call-signature"
    ],
    "typedef-whitespace": {
      "options": [
        {
          "call-signature": "nospace",
          "index-signature": "nospace",
          "parameter": "nospace",
          "property-declaration": "nospace",
          "variable-declaration": "nospace"
        },
        {
          "call-signature": "onespace",
          "index-signature": "onespace",
          "parameter": "onespace",
          "property-declaration": "onespace",
          "variable-declaration": "onespace"
        }
      ]
    },
    "variable-name": {
      "options": [
        "ban-keywords",
        "check-format",
        "allow-pascal-case"
      ]
    },
    "whitespace": {
      "options": [
        "check-branch",
        "check-decl",
        "check-operator",
        "check-separator",
        "check-type",
        "check-typecast"
      ]
    },
    "component-class-suffix": true,
    "contextual-lifecycle": true,
    "directive-class-suffix": true,
    "no-conflicting-lifecycle": true,
    "no-host-metadata-property": true,
    "no-input-rename": true,
    "no-inputs-metadata-property": true,
    "no-output-native": true,
    "no-output-on-prefix": true,
    "no-output-rename": true,
    "no-outputs-metadata-property": true,
    "template-banana-in-box": true,
    "template-no-negated-async": true,
    "use-lifecycle-interface": true,
    "use-pipe-transform-interface": true,
    "directive-selector": [
      true,
      "attribute",
      "app",
      "camelCase"
    ],
    "component-selector": [
      true,
      "element",
      "app",
      "kebab-case"
    ]
  }
}