初学react - 搭建项目及打包项目

浅浅的花香味﹌ 2021-09-29 08:46 720阅读 0赞

#### 初学react框架，请多指教 ####

### 一、项目搭建步骤： ###

#####  1、配置环境 #####

安装 nodejs，当然，这个在使用vue的时候也是需要安装好的。这一步我就不详细介绍了，大家可以去nodejs官网进行安装。

#####  2、在全局安装 creat-react-app cli #####

npm install -g create-react-app

这个如果直接安装在全局，后面再搭建其他react项目的时候就可以不用再安装了

#####  3、开始搭建项目 #####

create-react-app 文件名

#####  4、安装依赖 #####

npm install

#####  5、将配置项暴露出来 #####

暴露出配置项是为了让我们更方便修改相关的配置项

npm run eject

没暴露配置项之前：  
     ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0xpYW9GZW5nSmk_size_16_color_FFFFFF_t_70]  
   暴露配置项之后：  
     ![在这里插入图片描述][20190708100815974.png]

#####  6、启动项目 #####

npm start
    或者
    	npm run start

安装完成之后我们会看到的项目文件如下：  
     ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0xpYW9GZW5nSmk_size_16_color_FFFFFF_t_70 1]

##### 5、打包项目 #####

npm run build

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0xpYW9GZW5nSmk_size_16_color_FFFFFF_t_70]: /images/20210812/e88b5110496e4f47a0c1ed252cf8c372.png
[20190708100815974.png]: /images/20210812/bbee48417a084382b5eccc1cf52a64c5.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0xpYW9GZW5nSmk_size_16_color_FFFFFF_t_70 1]: /images/20210812/7899a0a835a9409aa5d4c915144c51dc.png

发表评论取消回复

表情：

评论列表（有 0 条评论，720人围观）

还没有评论，来说两句吧...

相关阅读

相关 React项目搭建

安装bower:npm install -g bower 安装react:bower install react Mixin的目的是让不同的组件公用一些逻辑实战项目：

拼搏现实的明天。/ 2023年07月17日 07:05/ 0 赞/ 54 阅读

相关 React脚手架搭建及创建React项目

一、Node.js 的诞生先来聊聊 Node.js 诞生的故事，了解一下它最早的定位，以及后来定位的变化。 Node.js 是2009的时候由大神 Ryan D

绝地灬酷狼/ 2023年07月11日 11:23/ 0 赞/ 142 阅读

相关 React ts 项目搭建

> React 是一个用于构建用户界面的 JavaScript 库。使用 create-react-app 创建项目全局安装 create-react-app

朴灿烈づ我的快乐病毒、/ 2023年07月09日 04:23/ 0 赞/ 92 阅读

相关 webpack 搭建 React 项目

使用 webpack 打包 React 项目根据官方文档上面说你的机器上安装的 Node >= 8.10 和 npm >= 5.6 1 . 所以第一步检查自己的

- 日理万妓/ 2022年12月09日 02:46/ 0 赞/ 264 阅读

相关 REACT 项目环境搭建

1. yum install nodejs 2.npm 淘宝镜像配置参考 http://blog.csdn.net/wangweiscsdn/article/detail

àì夳堔傛蜴生んèń/ 2022年06月08日 01:13/ 0 赞/ 367 阅读

相关搭建简单的React项目

[react…目录][react] -------------------- \\ React学习介绍学习了几个星期的React,想稍微整合一下知识，所以写了

清疚/ 2022年05月31日 05:53/ 0 赞/ 340 阅读

相关 React项目环境搭建demo

1、新建一个文件夹，ctrl + R 打开cmd 控制台，进入该文件夹，运行npm init；下面是我的目录 c:\Users\Administrator\Deskt

阳光穿透心脏的1/2处/ 2022年05月27日 11:21/ 0 赞/ 291 阅读

相关 React 项目记录（一）——项目搭建

> 此文根据 FungLeo 专栏博客 [https://blog.csdn.net/FungLeo/column/info/24249][https_blog.csdn.ne

﹏ヽ暗。殇╰゛Y/ 2022年03月26日 01:10/ 0 赞/ 684 阅读

相关初学react - 搭建项目及打包项目

初学react框架，请多指教一、项目搭建步骤： 1、配置环境安装 nodejs，当然，这个在使用vue的时候也是需要安装好的。这一步我就不详细介绍

浅浅的花香味﹌/ 2021年09月29日 08:46/ 0 赞/ 721 阅读

相关 react项目搭建MobX

1. 安装yarn npm install -g yarn 1. 安装依赖 yarn add mobx mobx-react @babel/plugi

ゞ浴缸里的玫瑰/ 2021年07月25日 18:04/ 0 赞/ 575 阅读