Fork-ts-checker-webpack-plugin: Add an example `tasks.json` to README?

[phryneas]

This is just something I was missing and that kept me personally from using fork-ts-checker-webpack-plugin in a few projects: integration with with the "Problems" tab in vscode.

But as I'm starting to dogfood now, too, I did a bit of googling and found https://code.visualstudio.com/docs/editor/tasks#_defining-a-multiline-problem-matcher which describes the process of defining yarn watch as a vscode task with a custom problem matcher.

That left me with the following configuration:

.vscode/tasks.json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "watch",
      "command": "yarn",
      "args": ["watch"],
      "isBackground": true,
      "problemMatcher": [
        {
          "owner": "ts-loader",
          "fileLocation": "absolute",
          "pattern": [
            {
              "regexp": "^\\[tsl\\] (ERROR|WARNING) in (.*)\\((\\d+,\\d+)\\)$",
              "file": 2,
              "location": 3,
              "severity": 1
            },
            { "regexp": "^\\s+(.+): (.*)$", "code": 1, "message": 2 }
          ],
          "background": {
            "activeOnStart": true,
            "beginsPattern": "Type checking and linting in progress\\.\\.\\.",
            "endsPattern": "^Time: \\d+ms"
          }
        },
        {
          "owner": "fork-ts-checker-webpack-plugin",
          "fileLocation": "absolute",
          "pattern": [
            {
              "regexp": "^(ERROR|WARNING) in (.*)\\((\\d+,\\d+)\\):$",
              "file": 2,
              "location": 3,
              "severity": 1
            },
            { "regexp": "^(.+): (.*)$", "code": 1, "message": 2 }
          ],
          "background": {
            "activeOnStart": true,
            "beginsPattern": "Type checking and linting in progress\\.\\.\\.",
            "endsPattern": "^Time: \\d+ms"
          }
        }
      ]
    }
  ]
}

Which raises the question: do we want to add that to the README? While it might be very useful for many people, the README is also getting very long and this is very tool-specific information.

As an alternative: what do you think about splitting some parts of the README out into additional markdown files and link those from a FAQ section in the README?

CODE_OF_CONDUCT.md and CONTRIBUTING.md are essentially first steps into that direction.

[johnnyreilly]

Which raises the question: do we want to add that to the README?

I don't use these myself but you're not the first person to raise it. So I think we should add it.

As an alternative: what do you think about splitting some parts of the README out into additional markdown files and link those from a FAQ section in the README?

I don't have strong feelings either way. Totally don't mind. @piotr-oles any views?

[piotr-oles]

Would be great to split README.md and make it more clear :) Please feel free to improve English as well - I'm not a native speaker :)

[piotr-oles]

@phryneas
Could you try the new version of the plugin (https://github.com/TypeStrong/fork-ts-checker-webpack-plugin/tree/v5.0.0-alpha.1) and update the tasks.json file? I would be happy to add it to the README.md but I'm not using vscode personally :)

[phryneas]

As I said in #404, I'll start dogfooding this soon.
I'll have to update the tasks.json then anyways, and I'll update it here then - thanks for keeping an eye on this :)

[eamodio]

Here is a the tasks.json I use for GitLens:

{
    "version": "2.0.0",
    "tasks": [
        {
            "type": "npm",
            "script": "build",
            "group": "build",
            "problemMatcher": ["$ts-checker5-webpack", "$ts-checker5-eslint-webpack"]
        },
        {
            "type": "npm",
            "script": "lint",
            "group": "build",
            "problemMatcher": ["$eslint-stylish"]
        },
        {
            "type": "npm",
            "script": "watch",
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "isBackground": true,
            "problemMatcher": ["$ts-checker5-webpack-watch", "$ts-checker5-eslint-webpack-watch"]
        }
    ]
}

Which uses the problem matchers from my TypeScript + Webpack Problem Matchers extension

[eamodio]

@phryneas FYI, you can use the npm type tasks even with yarn if you set "npm.packageManager": "yarn" in your vscode settings

[johnnyreilly]

I have only just realised that gitlens uses ts-loader and fork-ts-checker-webpack-plugin to build itself! I didn't realize you could use webpack to build a vs code extension.... There's so much I don't know!

[piotr-oles]

:tada: This issue has been resolved in version 5.0.0-alpha.11 :tada:

The release is available on:

• npm package (@alpha dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[piotr-oles]

:tada: This issue has been resolved in version 5.0.0-beta.1 :tada:

The release is available on:

• npm package (@beta dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[piotr-oles]

:tada: This issue has been resolved in version 5.0.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: