博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
创建react应用程序_创建React应用程序简介
阅读量:2504 次
发布时间:2019-05-11

本文共 3502 字,大约阅读时间需要 11 分钟。

创建react应用程序

is a project aimed at getting you up to speed with React in no time. It provides a ready-made React application starter, so you can dive into building your app without having to deal with Webpack and Babel configurations.

是一个旨在立即使您熟悉React的项目。 它提供了一个现成的React应用程序启动器,因此您无需考虑Webpack和Babel配置就可以深入构建应用程序。

It provides out of the box:

它提供了开箱即用的功能:

  • a development server with hot reloading

    具有热重载的开发服务器
  • provides a testing environment with Jest

    用Jest提供测试环境
  • allows to build the React app

    允许构建React应用
  • ready for ES6+ syntax

    准备使用ES6 +语法
  • bundles all your JavaScript and assets

    捆绑您所有JavaScript和资产
  • comes with CSS autoprefixer, SASS and CSS Modules support

    带有CSS自动前缀,SASS和CSS模块支持
  • and more!

    和更多!

You start by using , which is an easy way to download and execute Node.js commands without installing them. npx comes with npm (since version 5.2) and if you don’t have npm installed already, do it now from (npm is installed with Node).

首先使用 ,这是一种无需安装即可下载和执行Node.js命令的简便方法。 npx随附npm (自5.2版开始),如果尚未安装npm,请立即从进行安装(npm与Node一起安装)。

If you are unsure which version you have, I recommend checking out if you need to update.

如果不确定所使用的版本,建议您检查是否需要更新。

Tip: check out my terminal tutorial at if you’re unfamiliar with it

提示:如果您不熟悉我的终端机教程, 访问

When you run npx create-react-app <app-name>, npx is going to download the most recent create-react-app release, run it, and then remove it from your system. This is great because you will never have an outdated version on your system, and every time you run it, you’re getting the latest and greatest code available.

当运行npx create-react-app <app-name>npx下载最新的create-react-app版本,运行它,然后将其从系统中删除。 这很棒,因为您的系统上永远不会有过时的版本,并且每次运行它时,您都可以获得最新,最好的代码。

Let’s start then:

让我们开始:

npx create-react-app todolist

This is when it finished running:

这是它完成运行的时间:

create-react-app created a files structure in the folder you told (todolist in this case), and initialized a repository.

create-react-app在您指定的文件夹(在本例中为todolist中创建了一个文件结构,并初始化了一个存储库。

It also added a few commands in the package.json file, so you can immediately start the app by going into the folder and run npm start.

它还在package.json文件中添加了一些命令,因此您可以通过进入文件夹并运行npm start立即启动应用npm start

In addition to npm start, create-react-app added a few other commands:

除了npm startcreate-react-app还添加了一些其他命令:

  • npm run build: to build the React application files in the build folder, ready to be deployed to a server

    npm run build :在build文件夹中构建React应用程序文件,准备将其部署到服务器上

  • npm test: to run the testing suite using

    npm test :使用运行测试套件

  • npm eject: to eject from create-react-app

    npm eject :从create-react-app弹出

Ejecting is the act of deciding that create-react-app has done enough for you, but you want to do more than what it allows.

退出是决定create-react-app对您已经足够完成的动作,但是您想要做的事情超出其允许的范围。

Since create-react-app is a set of common denominator conventions and a limited amount of options, it’s somewhat guaranteed that at some point your needs will require you something unique that outgrows the capabilities of create-react-app.

由于create-react-app是一组通用的分母约定,并且选项数量有限,因此可以保证在某些时候您的需求将需要一些独特的东西,而这些东西超出了create-react-app

When you eject, you lose the ability of automatic updates but you gain more flexibility in the and configuration.

弹出时,您将失去自动更新的能力,但在和配置中获得了更大的灵活性。

When you eject the action is irreversible. You will get 2 new folders in your application directory, config and scripts. Those contain all the configuration you need and now you can start editing it.

当您弹出时,动作是不可逆的。 您将在应用程序目录, configscripts获得2个新文件夹。 这些包含所需的所有配置,现在您可以开始对其进行编辑。

翻译自:

创建react应用程序

转载地址:http://ilqgb.baihongyu.com/

你可能感兴趣的文章
有意思的cmd命令
查看>>
js正則表達式语法
查看>>
VS2013 添加已有文件夹
查看>>
python 计时程序运行时间
查看>>
Git学习系列-Git基本概念
查看>>
c#多个程序集使用app.config 的解决办法
查看>>
Linux+Apache+PHP+MySQL服务器环境配置(CentOS篇)
查看>>
Linux下获取本机IP地址的代码
查看>>
(C#)调用Webservice,提示远程服务器返回错误(500)内部服务器错误
查看>>
flex布局
查看>>
python-----python的文件操作
查看>>
java Graphics2d消除锯齿,使字体平滑显示
查看>>
控件中添加的成员变量value和control的区别
查看>>
Spring Boot Docker 实战
查看>>
Div Vertical Menu ver3
查看>>
Git简明操作
查看>>
InnoDB为什么要使用auto_Increment
查看>>
课堂练习之买书打折最便宜
查看>>
定义函数
查看>>
网络虚拟化技术(二): TUN/TAP MACVLAN MACVTAP
查看>>