从零开始React之环境的搭建与项目的初始化

最新推荐文章于 2024-06-08 14:08:49 发布
最新推荐文章于 2024-06-08 14:08:49 发布
阅读量6.7k 收藏 7
点赞数 1
分类专栏： 前端 文章标签： react node js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Code_XiaoLu/article/details/80831969
版权

React

简介：React是Facebook开发的一款JS库，是一个声明式、组件化并且用于构建用户界面的 JavaScript 库，通俗来讲就是将界面分成可以复用的组件，在需要时引入，使界面解耦，互不影响而又相互联系，在界面更新时，只会更新需要更新的组件，使得效率和性能上大大提升。

1、环境搭建

  1. 安装node
    大家可以去官网下载安装包：node官网
    安装没有什么可以讲的，一路下一步即可， 安装完成后打开控制台输入
CrckerdeMacBook-Pro:~ crcker$ node -v
v10.0.0

如果能正确输出版本号说明node已经安装完成，否则需要配置环境变量，这里不做介绍
2. 安装npm和cnpm
npm其实是Node.js的包管理工具，可以使我们方便的引入各种js库,当我们安装完node.js之后，npm也已经安装完成，打开终端输入

最低0.47元/天 解锁文章
Crcker
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
项目初始化
Y18356309212的博客
03-14 791
项目初始化步骤 准备一个用来包装你项目的文件夹————Object文件夹 ​ 1.在终端中打开Object文件夹，输入 **npm init** (你也可以直接 npm init -y,这样可以直接帮你生成一些信息，不用你手动去填写)，用它来管理你的文件 ​ 2.在终端中继续输入 **git init** ,用Git来管理项目，方便你保存到GitHub上去 ​ 3.准备源码文件夹src，在...
React简单项目，熟悉项目大致完整流程
qq_39608291的博客
02-20 830
react的简单项目的的大致完整开发流程，包含了生产，导包，登录token，token持久化，项目的打包等
React环境搭建
weixin_47075145的博客
11-18 6296
这里面包含了react项目中会用到的一些组件，install的时候下载下来的，你可以进去看看，有一些如base64之类的我们可能会用到的组件，或者一些第三方库；：让目录结构更易懂:接下来，我们改动一下src里面的内容和结构，让首次接触react的小伙伴尽量能觉得他有点亲切的感觉，事实证明，越亲切的事物我们越希望去接近。：里面包含了一些我们自己使用的js文件，css文件，img文件等等，但你打开src文件夹你会发现很混乱，不要管什么app.js，你就看到。，并且这也是react工程的。
React实战（一）初始化项目、配置router、redux、axios
最新发布
DogEgg_001的博客
06-08 967
初始化项目、配置router、配置redux、配置axios
react环境搭建
热门推荐
大帅的博客
09-20 1万+
React由facebook公司开创，用于搭建响应式的前端页面 首先，我们需要安装node.js，直接搜索并在官网下载安装包。 node.js官网：https://nodejs.org/en/ 然后，根据安装提示安装node.js，npm包管理工具也会一同安装。 安装完成后，打开cmd命令行,输入 node -v 和 npm -v 来查看版本号，如果显示则安装完成。 现在我们成功安装了node和...
React学习(一)React开发环境搭建,使用create-react-app创建一个demo
sun_luming的博客
12-08 1395
React开发过程中会使用大量node.js提供的各种库（就像Java开发需要使用大量的jar包一样），我们在开发Java程序时使用Maven来管理开发过程中使用的jar包，相应的在开发React程序时我们需要使用npm (这里给个npm的全称吧，node package manager，Node 包管理器，看翻译过来的意思就知道是干什么的) 来管理node提供的各种库。 第一步：安装node.j...
React从零开始搭建项目
QZ9420的博客
09-03 412
const {override , fixBabelImports } = require('customize-cra') module . exports = override(// 针对antd实现按需打包：根据import进行打包（使用babel-plugin-import） fixBabelImports('import' , {libraryName : 'antd' , libraryDirectory : 'es' , style : 'css' // 自动打包相关的样式 }))
从零开始搭建webpack+react开发环境的详细步骤
08-27
从零开始搭建webpack+react开发环境的详细步骤 本资源主要介绍了从零开始搭建webpack+react开发环境的详细步骤，涵盖了webpack的安装、配置、loader的使用、插件的配置等内容。 一、环境依赖 在开始搭建webpack+...
react-init:初始化一个React项目
05-01
"react-init"通常是指使用特定工具或脚手架初始化一个新的React项目，这使得开发者能够快速搭建起开发环境，避免从零开始设置各种配置。在这个过程中，我们通常会涉及到以下几个核心知识点： 1. **创建React应用**...
react-一步一步搭建一个react项目环境
08-14
以上步骤概括了从零开始搭建React项目的基本流程，包括Webpack的配置、Babel的使用，以及开发服务器的设置。随着项目的发展，你可能还需要添加更多配置，如处理CSS、图片、静态资源等。理解这些基础设置将帮助你更好...
NPM React从零开始搭建
07-22
本教程将引导你从零开始，利用NPM(Node Package Manager)，在Node.js环境中搭建React项目。NPM是JavaScript开发中广泛使用的包管理器，它使得安装、管理和共享依赖变得简单。而React则是一个用于构建用户界面的库，...
从零开始搭建一个react项目开发
08-28
主要介绍了从零开始搭建一个react项目开发,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
React开发环境搭建
01-08
安装NodeJS 进入Node中文网 ，下载安装nodeJS。 安装完成后，使用Win+R打开运行，然后输入cmd，打开终端。 输入代码查看node和npm版本号，有版本号说明安装成功： node -v npm -v 脚手架安装 在终端输入以下命令安装脚手架 npm install -g create-react-app create-react-app是React官方出的脚手架工具，我们这里使用官方脚手架。 创建第一个React项目 脚手架安装完成后，就可以创建项目了，我们在F盘创建一个ReactDemo文件夹，然后进入这个文件夹创建新的React项目。 C:\Users\Admini
使用react实现后台管理系统项目
m0_71933813的博客
12-30 8916
一.开发React必须依赖三个库 1.react：包含react所必须的核心代码 2.react-dom：react渲染在不同平台所需要的核心代码 3.babel：将jsx转换成React代码的工具 二.React的依赖引入 1.方式一：直接CDN引入 2.方式二：下载后，添加本地依赖 1).在html中引入 a.react.js b.react-dom.js c.b
学React：简单搭建react环境
weixin_44077623的博客
07-11 466
学react的第一天
从零开始搭建react项目（一）
yemuxia_sinian的博客
01-03 7406
自学react有一段时间了，官网文档基础的看了一遍，然后便把之前公司做的一个vue项目用react搭建了下，顺便整理下一些知识点。 项目大概效果： 一、利用create-react-app搭建项目 1、全局安装create-react-app，执行：npm install -g create-react-app 命令进行安装 2、进入要安装项目的文件夹，执行：npx create-re......
React.js框架技术
03-24
react.js零基础入门到项目实战，全面介绍react框架开发全家桶技术，基于create-react-app脚手架，结合实战案例，由浅入深，通俗易懂并全面的介绍react.js技术点，引入redux数据管理框架，全面详细介绍redux基础与redux进阶内容，最终整合项目实战，在项目开发过程中，重复时间react与redux技术，并引入真是项目开发中的更多全新技术点，带你从零基础小白，成为react.js框架技术的高手。
如何从零开始创建React项目
while(true){alert(
01-13 1万+
首先运行环境-node是必须的，需要下载安装node的运行环境，官网下载即可点击打开链接 安装好了node之后，自然的就有了npm，npm可以帮助开发人员，下载React项目必用的一些包，当然也可使用yarn，本文使用的是yarn 全局安装create-react-app  npm install -g create-react-app create-react-app mya...
vite初始化react项目并搭建开发环境
05-18
好的，以下是使用 Vite 初始化 React 项目并搭建开发环境的步骤： 1. 首先需要安装 Node.js 和 npm，如果已经安装可以跳过此步骤。在终端输入以下命令安装： ``` # 使用 nvm 安装 Node.js curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash # 刷新终端 source ~/.bashrc # 安装 Node.js nvm install node ``` 2. 安装 Vite。在终端输入以下命令： ``` npm install -g vite ``` 3. 初始化 React 项目。在终端输入以下命令： ``` # 在当前目录下初始化项目 vite init react my-project ``` 4. 进入项目目录。在终端输入以下命令： ``` cd my-project ``` 5. 安装依赖。在终端输入以下命令： ``` npm install ``` 6. 启动开发环境。在终端输入以下命令： ``` npm run dev ``` 现在你已经成功搭建了基于 Vite 的 React 开发环境，可以开始愉快地编写代码了！

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值