Κοινή χρήση τεχνολογίας

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

1. Εγκαταστήστε το νήμα

1. Εγκαταστήστε τα Node.js και npm

Εάν δεν έχετε εγκαταστήσει ακόμα το Node.js και το npm, μπορείτε να το εγκαταστήσετε απόΕπίσημος ιστότοπος Node.jsΚάντε λήψη και εγκατάσταση της πιο πρόσφατης έκδοσης του Node.js, το npm θα εγκατασταθεί μαζί με το Node.js.

2. Εγκαταστήστε το Yarn χρησιμοποιώντας npm

Ανοίξτε μια γραμμή εντολών ή PowerShell και εκτελέστε την ακόλουθη εντολή για να εγκαταστήσετε το Yarn παγκοσμίως:

npm install -g yarn
1

3. Επαληθεύστε την εγκατάσταση

Αφού ολοκληρωθεί η εγκατάσταση, εκτελέστε την ακόλουθη εντολή για να επαληθεύσετε εάν το Yarn εγκαταστάθηκε με επιτυχία:

yarn --version
1

2. Διαμορφώστε το νήμα

1. Αρχικοποίηση έργου

Μεταβείτε στον κατάλογο του έργου σας σε μια γραμμή εντολών ή στο PowerShell και εκτελέστε την ακόλουθη εντολή για να αρχικοποιήσετε ένα νέο έργο Yarn:

yarn init
1

Συμπληρώστε τις σχετικές πληροφορίες του έργου σύμφωνα με τις προτροπές Μετά την ολοκλήρωση, αpackage.jsonέγγραφο.

2. Προσθέστε εξαρτήσεις

Για παράδειγμα, προσθέστεreactκαιreact-domβασίζομαι:

yarn add react react-dom
1

3. Εγκαταστήστε όλες τις εξαρτήσεις

αν υπάρχει ήδη έναpackage.jsonαρχείο, εκτελέστε την ακόλουθη εντολή για να εγκαταστήσετε όλες τις εξαρτήσεις:

yarn install
1

3. Χρήση Νήματος σε VSCode

1. Ανοίξτε το VSCode

Μεταβείτε στον κατάλογο του έργου σας στη γραμμή εντολών ή στο PowerShell και εκτελέστε την ακόλουθη εντολή για να ανοίξετε το VSCode:

code .
1

2. Εκτελέστε την εντολή Yarn

Μπορείτε να εκτελέσετε εντολές Yarn στο ενσωματωμένο τερματικό του VSCode. Για παράδειγμα, για να εγκαταστήσετε νέες εξαρτήσεις:

yarn add <package-name>
1

3. Εργασίες διαμόρφωσης

Μπορείτε να διαμορφώσετε εργασίες στο VSCode ώστε να εκτελούν εντολές Yarn.Δημιουργήστε ή επεξεργαστείτε το.vscode/tasks.jsonαρχείο, προσθέστε την ακόλουθη διαμόρφωση:

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

Σε αυτό το αρχείο ρυθμίσεων, μπορείτε να το κάνετε αυτό πατώνταςCtrl+Shift+BΠλήκτρα συντόμευσης για την εκτέλεση διαμορφωμένων εργασιών.

4. Εντοπισμός σφαλμάτων και άλλες διαμορφώσεις

1. Προσθήκη διαμόρφωσης εντοπισμού σφαλμάτων

Δημιουργήστε ή επεξεργαστείτε το.vscode/launch.jsonαρχείο, προσθέστε την ακόλουθη διαμόρφωση:

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

Αυτό θα εκτελεστεί αυτόματα πριν ξεκινήσει ο εντοπισμός σφαλμάτωνYarn InstallΕργο.

2. Χρησιμοποιήστε σενάρια Yarn

μπορείςpackage.json Καθορίστε το σενάριο στο αρχείο και εκτελέστε το στο ενσωματωμένο τερματικό του VSCode. Για παράδειγμα:

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

Εκτελέστε το σενάριο:

yarn start
1

yarn build
1