什么是create-react-app

什么是create-react-app

Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具。它本身集成了Webpack,并配置了一系列内置的loader和默认的npm的脚本,可以很轻松的实现零配置就可以快速开发React的应用。

下面介绍一下create-react-app的安装及使用。(推荐教程:Node.js教程

全局安装

首先确保你电脑上安装最新的

# 全局安装
npm install -g create-react-app
# 构建一个my-app的项目
npx create-react-app my-app
cd my-app
# 启动编译当前的React项目,并自动打开 http://localhost:3000/
npm start

以上命令执行完成后,则自动打开: http://localhost:3000/

如果你不能确保最新版本,可以先尝试卸载: npm uninstall -g create-react-app,然后再全局安装。

构建React项目的其他方式

npm
# npm init <initializer> is available in npm 6+
npm init react-app my-app
Yarn
# yarn create is available in Yarn 0.25+
yarn create react-app my-app

项目目录

项目的默认目录:

├── package.json
├── public                  # 这个是webpack的配置的静态目录
│   ├── favicon.ico
│   ├── index.html          # 默认是单页面应用,这个是最终的html的基础模板
│   └── manifest.json
├── src
│   ├── App.css             # App根组件的css
│   ├── App.js              # App组件代码
│   ├── App.test.js
│   ├── index.css           # 启动文件样式
│   ├── index.js            # 启动的文件(开始执行的入口)!!!!
│   ├── logo.svg
│   └── serviceWorker.js
└── yarn.lock

默认的npm的脚本

启动开发

npm start
# or
yarn start

启动测试

npm test
#or
yarn test

构建生产版本

npm run build
#or
yarn build

本文来自React答疑栏目,欢迎学习!

以上就是什么是create-react-app的详细内容,更多请关注html中文网其它相关文章!

赞(0) 打赏
未经允许不得转载:html中文网首页 » React 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏