Compartilhamento de tecnologia

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

1. Instale o fio

1. Instale Node.js e npm

Se você ainda não instalou o Node.js e o npm, poderá instalá-lo emSite oficial do Node.js.Baixe e instale a versão mais recente do Node.js, o npm será instalado junto com o Node.js.

2. Instale o Yarn usando npm

Abra um prompt de comando ou PowerShell e execute o seguinte comando para instalar o Yarn globalmente:

npm install -g yarn
1

3. Verifique a instalação

Após a conclusão da instalação, execute o seguinte comando para verificar se o Yarn foi instalado com sucesso:

yarn --version
1

2. Configurar Fio

1. Inicialize o projeto

Navegue até o diretório do seu projeto em um prompt de comando ou PowerShell e execute o seguinte comando para inicializar um novo projeto Yarn:

yarn init
1

Preencha as informações relevantes do projeto de acordo com as instruções. Após a conclusão, um.package.jsondocumento.

2. Adicione dependências

Por exemplo, adicionereactereact-domconfiar:

yarn add react react-dom
1

3. Instale todas as dependências

se já existe umpackage.jsonarquivo, execute o seguinte comando para instalar todas as dependências:

yarn install
1

3. Usando Yarn no VSCode

1. Abra o VSCode

Navegue até o diretório do seu projeto no prompt de comando ou PowerShell e execute o seguinte comando para abrir o VSCode:

code .
1

2. Execute o comando Yarn

Você pode executar comandos do Yarn no terminal integrado do VSCode. Por exemplo, para instalar novas dependências:

yarn add <package-name>
1

3. Tarefas de configuração

Você pode configurar tarefas no VSCode para executar comandos do Yarn.Crie ou edite o.vscode/tasks.jsonarquivo, adicione a seguinte configuração:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Yarn Install",
      "type": "shell",
      "command": "yarn install",
      "group": "build",
      "problemMatcher": [],
      "detail": "安装项目所有依赖"
    },
    {
      "label": "Yarn Add",
      "type": "shell",
      "command": "yarn add",
      "args": [
        "${input:packageName}"
      ],
      "group": "build",
      "problemMatcher": [],
      "detail": "添加新的项目依赖"
    }
  ],
  "inputs": [
    {
      "id": "packageName",
      "type": "promptString",
      "description": "请输入要添加的依赖包名"
    }
  ]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

Neste arquivo de configuração, você pode fazer isso pressionandoCtrl+Shift+BTeclas de atalho para executar tarefas configuradas.

4. Depuração e outras configurações

1. Adicione configuração de depuração

Crie ou edite o.vscode/launch.jsonarquivo, adicione a seguinte configuração:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Program",
      "type": "node",
      "request": "launch",
      "program": "${workspaceFolder}/app.js",
      "preLaunchTask": "Yarn Install",
      "outFiles": [
        "${workspaceFolder}/dist/**/*.js"
      ]
    }
  ]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Isso será executado automaticamente antes de iniciar a depuraçãoYarn InstallTarefa.

2. Use scripts Yarn

você podepackage.json Defina o script no arquivo e execute-o no terminal integrado do VSCode. Por exemplo:

{
  "scripts": {
    "start": "node app.js",
    "build": "webpack --config webpack.config.js"
  }
}
1
2
3
4
5
6

Execute o script:

yarn start
1

yarn build
1