ToB企服应用市场:ToB评测及商务社交产业平台

标题: Windows体系上利用npm来安装和设置Yarn，在VSCode中利用 [打印本页]
作者: 杀鸡焉用牛刀    时间: 2024-7-16 13:35
标题: Windows体系上利用npm来安装和设置Yarn，在VSCode中利用
一、安装Yarn

1. 安装Node.js和npm

假如还没有安装Node.js和npm，可以从Node.js官方网站下载并安装最新版本的Node.js，npm会随Node.js一起安装。
2. 利用npm安装Yarn

打开下令提示符或PowerShell，运行以下下令来全局安装Yarn：
  1. npm install -g yarn
复制代码
3. 验证安装

安装完成后，运行以下下令来验证Yarn是否安装成功：
  1. yarn --version
复制代码
二、设置Yarn

1. 初始化项目

在下令提示符或PowerShell中导航到你的项目目次，运行以下下令来初始化一个新的Yarn项目：
  1. yarn init
复制代码
根据提示填写项目标相干信息，完成后会生成一个package.json文件。
2. 添加依赖

比方，添加react和react-dom依赖：
  1. yarn add react react-dom
复制代码
3. 安装全部依赖

假如已经有一个package.json文件，运行以下下令来安装全部依赖：
  1. yarn install
复制代码
三、在VSCode中利用Yarn

1. 打开VSCode

在下令提示符或PowerShell中导航到你的项目目次，运行以下下令来打开VSCode：
  1. code .
复制代码
2. 运行Yarn下令

你可以在VSCode的集成终端中运行Yarn下令。比方，安装新依赖：
  1. yarn add <package-name>
复制代码
3. 设置任务

你可以在VSCode中设置任务来运行Yarn下令。创建或编辑项目根目次下的.vscode/tasks.json文件，添加如下设置：
  1. {  "version": "2.0.0",  "tasks": [    {      "label": "Yarn Install",      "type": "shell",      "command": "yarn install
  2. ",      "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": "请输入要添加的依赖包名"    }  ]}
复制代码
在这个设置文件中，你可以通过按下Ctrl+Shift+B快捷键来运行设置的任务。
四、调试与其他设置

1. 添加调试设置

创建或编辑项目根目次下的.vscode/launch.json文件，添加如下设置：
  1. {
  2.   "version": "0.2.0",
  3.   "configurations": [
  4.     {
  5.       "name": "Launch Program",
  6.       "type": "node",
  7.       "request": "launch",
  8.       "program": "${workspaceFolder}/app.js",
  9.       "preLaunchTask": "Yarn Install",
  10.       "outFiles": [
  11.         "${workspaceFolder}/dist/**/*.js"
  12.       ]
  13.     }
  14.   ]
  15. }
复制代码
这会在启动调试前自动运行Yarn Install任务。
2. 利用Yarn脚本

你可以在package.json文件中定义脚本，并在VSCode的集成终端中运行。比方：
  1. {
  2.   "scripts": {
  3.     "start": "node app.js",
  4.     "build": "webpack --config webpack.config.js"
  5.   }
  6. }
复制代码
运行脚本：
  1. yarn start
复制代码
  1. yarn build
复制代码
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。



欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/) Powered by Discuz! X3.4