一、安装Yarn
1. 安装Node.js和npm
如果还没有安装Node.js和npm,可以从Node.js官方网站下载并安装最新版本的Node.js,npm会随Node.js一起安装。
2. 使用npm安装Yarn
打开命令提示符或PowerShell,运行以下命令来全局安装Yarn:
npm install -g yarn
3. 验证安装
安装完成后,运行以下命令来验证Yarn是否安装成功:
yarn --version
二、配置Yarn
1. 初始化项目
在命令提示符或PowerShell中导航到你的项目目录,运行以下命令来初始化一个新的Yarn项目:
yarn init
根据提示填写项目的相关信息,完成后会生成一个package.json
文件。
2. 添加依赖
例如,添加react
和react-dom
依赖:
yarn add react react-dom
3. 安装所有依赖
如果已经有一个package.json
文件,运行以下命令来安装所有依赖:
yarn install
三、在VSCode中使用Yarn
1. 打开VSCode
在命令提示符或PowerShell中导航到你的项目目录,运行以下命令来打开VSCode:
code .
2. 运行Yarn命令
你可以在VSCode的集成终端中运行Yarn命令。例如,安装新依赖:
yarn add <package-name>
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": "请输入要添加的依赖包名"
}
]
}
在这个配置文件中,你可以通过按下Ctrl+Shift+B
快捷键来运行配置的任务。
四、调试与其他配置
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"
]
}
]
}
这会在启动调试前自动运行Yarn Install
任务。
2. 使用Yarn脚本
你可以在package.json
文件中定义脚本,并在VSCode的集成终端中运行。例如:
{
"scripts": {
"start": "node app.js",
"build": "webpack --config webpack.config.js"
}
}
运行脚本:
yarn start
yarn build