当前位置: 首页 > news >正文

Windows系统上使用npm来安装和配置Yarn,在VSCode中使用

一、安装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. 添加依赖

例如,添加reactreact-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
http://www.lryc.cn/news/400281.html

相关文章:

  • Unity ColorSpace 之 【颜色空间】相关说明,以及【Linear】颜色校正 【Gamma】的简单整理
  • JavaScript的学习(二)
  • 【接口自动化_06课_Pytest+Excel+Allure完整框架集成】
  • Profibus协议转Profinet协议网关模块连接智能电表通讯案例
  • 【学习笔记】无人机(UAV)在3GPP系统中的增强支持(九)-无人机服务区分离
  • acrobat 中 PDF 复制时不能精确选中所选内容所在行的一种解决方法
  • 安卓学习中遇到的问题【bug】
  • 【日常记录】【CSS】display:inline 的样式截断
  • 数据库系统安全
  • Qt MV架构-代理模型
  • WebSocket实现群聊功能、房间隔离
  • 顶顶通呼叫中心中间件实现随时启动和停止质检(mod_cti基于FreeSWITCH)
  • 基于conda包的环境创建、激活、管理与删除
  • 处理线程安全的列表CopyOnWriteArrayList 和Collections.synchronizedList
  • 技术成神之路:设计模式(六)策略模式
  • 华为OD机考题(HJ90 合法IP)
  • 值得关注的数据资产入表
  • Postman API性能测试:解锁高级技巧的宝库
  • stm32中断详解
  • 【LeetCode】最小栈
  • 链接追踪系列-09.spring cloud项目整合elk显示业务日志
  • 老年生活照护实训室:让养老护理更个性化
  • c++课后作业
  • SpringBoot+Vue实现简单的文件上传(txt篇)
  • LLMs之RAG:GraphRAG(本质是名词Knowledge Graph/Microsoft微软发布)的简介、安装和使用方法、案例应用之详细攻略
  • Linux 之前的 Unix 桌面沉浮启示录
  • 面试问题梳理:项目中防止配置中的密码泄露-Jasypt
  • engine.addImportPath()用于向 QML 引擎添加新的模块搜索路径
  • ServiceNow UI Jelly模板注入漏洞复现(CVE-2024-4879)
  • 项目部署笔记