Partage de technologie

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

1. Installer le fil

1. Installez Node.js et npm

Si vous n'avez pas encore installé Node.js et npm, vous pouvez l'installer depuisSite officiel de Node.jsTéléchargez et installez la dernière version de Node.js, npm sera installé avec Node.js.

2. Installez Yarn à l'aide de npm

Ouvrez une invite de commande ou PowerShell et exécutez la commande suivante pour installer Yarn globalement :

npm install -g yarn
1

3. Vérifiez l'installation

Une fois l'installation terminée, exécutez la commande suivante pour vérifier si Yarn est installé avec succès :

yarn --version
1

2. Configurer le fil

1. Initialiser le projet

Accédez au répertoire de votre projet dans une invite de commande ou PowerShell et exécutez la commande suivante pour initialiser un nouveau projet Yarn :

yarn init
1

Remplissez les informations pertinentes du projet selon les invites. Une fois terminé, un.package.jsondocument.

2. Ajouter des dépendances

Par exemple, ajoutezreactetreact-domcompter sur:

yarn add react react-dom
1

3. Installez toutes les dépendances

s'il y en a déjà unpackage.json, exécutez la commande suivante pour installer toutes les dépendances :

yarn install
1

3. Utiliser Yarn dans VSCode

1. Ouvrez VSCode

Accédez au répertoire de votre projet dans l'invite de commande ou PowerShell et exécutez la commande suivante pour ouvrir VSCode :

code .
1

2. Exécutez la commande Yarn

Vous pouvez exécuter des commandes Yarn dans le terminal intégré de VSCode. Par exemple, pour installer de nouvelles dépendances :

yarn add <package-name>
1

3. Tâches de configuration

Vous pouvez configurer des tâches dans VSCode pour exécuter des commandes Yarn.Créer ou modifier le.vscode/tasks.jsonfichier, ajoutez la configuration suivante :

{
  "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

Dans ce fichier de configuration, vous pouvez le faire en appuyant surCtrl+Shift+BTouches de raccourci pour exécuter les tâches configurées.

4. Débogage et autres configurations

1. Ajouter une configuration de débogage

Créer ou modifier le.vscode/launch.jsonfichier, ajoutez la configuration suivante :

{
  "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

Cela s'exécutera automatiquement avant de commencer le débogageYarn InstallTâche.

2. Utilisez des scripts Yarn

tu peuxpackage.json Définissez le script dans le fichier et exécutez-le dans le terminal intégré de VSCode. Par exemple:

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

Exécutez le script :

yarn start
1

yarn build
1