Window 前端开发环境和工具安装

本文详细介绍了Node.js和Git的安装步骤,包括环境变量配置、SSHKey生成及GitHub账户关联,以及Webstorm的安装与激活流程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

安装 Node:

Node 安装会默认装好 npm。
npm 是 Node 官方为 Node 定制的一个工具,是 Node 的包管理器。

  1. 下载安装包:在官网中 https://nodejs.org/zh-cn/download/ 下载 Node 安装包,双击安装包运行安装。
  2. 配置环境变量:右击 我的电脑 --> 属性 --> 高级系统设置 --> 环境变量,在系统变量的 Path 下新建输入 Node 的路径即可。
    在这里插入图片描述
    在这里插入图片描述在这里插入图片描述

安装 Git:

  1. 在官网 https://git-scm.com/downloads/ 下载 Git。

  2. 安装包下载完成后进行安装,鼠标右击如果看到有两个 git 的选项则表明 Git 安装成功了。
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

  3. 在终端配置用户名和用户邮箱。

    git config --global user.name "Your Name"
    git config --global user.email "email@example.com"
    
  4. 创建 SSH Key 生成秘钥:在终端输入 ssh-keygen -t rsa -C "liuchao102@163.com",需要把邮件地址换成自己的 Git 登录账户,然后一路回车,使用默认值即可,可以在用户主目录里找到 .ssh 目录,里面有 id_rsaid_rsa.pub 两个文件。

    SSH 的作用是让本地版本库与远程版本库通信,也就是你在本地修改好的代码,需要同步到服务器上的时候,就需要这个 SSH 密钥来通讯。

    如果不显示 pub 文件,可能是电脑没有开启显示已知文件扩展名。
    解决方法:点击查看->文件扩展名即可在这里插入图片描述

    在这里插入图片描述

  5. 登陆 GitHub,打开 Account settings --> SSH Keys 页面,然后点击 Add SSH Key,填上任意Title,在 Key 文本框里粘贴 id_rsa.pub 文件的内容。
    在这里插入图片描述

安装 Webstorm:

  1. 在官网 https://www.jetbrains.com/webstorm/download/#section=windows,根据自己的电脑系统下载安装包。
  2. 下载完成后双击 .exe 文件进行安装。
    在这里插入图片描述
    在这里插入图片描述

Webstorm 2019.2.3:

  1. 将下面两个文件放到一个纯英文的路径下。
    在这里插入图片描述
  2. 点击 Evaluate for free 进入 Webstorm。
    在这里插入图片描述
  3. 点击 Help --> Edit Custom VM options,然后将 -javaagent:C:\ProgramData\Microsoft\Windows\Start Menu\Programs\webstormFixer\jetbrains-agent.jar 改为自己的第一步的文件路径。
    在这里插入图片描述

在这里插入图片描述

  1. 关掉 Webstorm 重新进入。
  2. 点击 Help-->Register,然后将 https://fls.jetbrains-agent.com 复制到如下位置即可。
    在这里插入图片描述
    在这里插入图片描述
  3. 重启Webstorm进入即可正常使用;
window 前端开发环境的搭建过程如下: 1. 安装 Node.js:前端开发中,我们常常使用到 Node.js 做为运行环境。可以到 Node.js 官网下载最新的 Windows 版本安装包,下载完成后运行安装程序进行安装即可。 2. 安装代码编辑器:选择一款适合自己的代码编辑器,如 Visual Studio Code、Sublime Text、Atom 等。下载安装后打开即可使用。 3. 安装版本控制工具:推荐使用 Git 进行版本控制。可以在 Git 官网下载并安装最新版本的 Git,安装完成后通过命令行工具检查版本是否安装成功:`git --version` 4. 安装代码托管工具:推荐使用 GitHub 作为代码托管平台。在 GitHub 官网注册账号并创建仓库,以便于将项目代码进行托管。 5. 安装包管理工具:在前端开发中,常常需要使用到一些第三方包工具。推荐使用 npm 进行包管理。npm 是随同 Node.js 一起安装的包管理工具。可以通过命令行工具检查 npm 是否安装成功:`npm -v` 6. 初始化项目:打开命令行工具,将命令行的当前目录切换到项目所在的文件夹下。运行 `npm init` 命令初始化项目,按照提示进行一些基本配置,如项目名称、版本号等。 7. 安装所需依赖:通过 `npm install [package]` 命令来安装项目需要的依赖,如常见的 React、Vue、Webpack 等。 8. 配置项目:根据项目需求,进行相应的配置,如创建配置文件、设置编译打包规则等。 9. 编写代码:使用所选的代码编辑器打开项目文件夹,并开始编写前端代码。 10. 运行项目:在命令行工具中运行相应的命令,如 `npm start`,来启动项目并在浏览器中查看网页效果。 11. 进行版本管理:使用 Git 命令来进行版本管理,比如添加、提交推送代码等。 通过以上步骤,我们就可以在 Windows 系统上成功搭建一个前端开发环境
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值