Shulou(Shulou.com)06/01 Report--

This article mainly introduces "how to configure Tasks". In daily operation, I believe many people have doubts about how to configure Tasks. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer the doubts of "how to configure Tasks"! Next, please follow the editor to study!

Configure Tasks

Suppose you want to run a unit test for a specific test file, your test command might look like this:

Npm test 'my-component.js'-- auto-watch-- no-single-run

My usual workflow is as follows. I want to run the unit test I'm doing in watch mode. Normally, you need to insert a file name into the test command, but VSCode can do it for you. To achieve this goal, we can use some of the replacement variables provided for us. For example: ${fileBasename}. A complete list of available variables can be found in the official documentation here.

Now, open the command panel again, select tasks: run tasks, and then select tasks that are not configured. Configure tasks. "then select the task you want to configure. This creates and opens a new file in the project: .vscode / tasks.json. You can add this file to .gitignore or submit it, so your team can also use these tasks.

After you add a replacement variable, the configuration should look like this:

{"version": "2.0.0", "tasks": [{"type": "npm", "script": "test ${fileBasename}-- auto-watch-- no-single-run", "problemMatcher": [], "label": "npm: test opened file", "detail": "npm test"}]}

Then, in this way, your custom tasks can be run in the command panel. Your custom tasks are now in the list that you can run from Command Palette. Now open the test file you want to run, such as my-component-test.js. Run Cmd + Shift + P-> "Tasks: run tasks" and you should see the newly configured task: "npm: test opened file". Select it, and it should run npm test my-component-test.js-- auto-watch-- no-single-run in the terminal. You can also customize how the script results are displayed. I want to open a new terminal for this type of command. To do this, you only need to provide an additional "demo" configuration.

{... "presentation": {"panel": "dedicated",}}

Now you can see that multiple terminal windows are open and you can switch between them.

Configure Shell Tasks

If you want to execute other Shell commands, VSCode also supports it. Now we can use shell instead of the npm type. For example.

{"version": "2.0.0", "tasks": [{"label": "Run Cypress", "type": "shell", "command": "cd tests/e2e/cypress/ & & npm run cypress",}} this is the end of the study on "how to configure Tasks". Hope to solve everyone's doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.