create react app

蔡鹏程
2023-12-01


官网: https://create-react-app.dev/

index

less to learn:

When it’s time to deploy, your bundles are optimized automatically.
部署时,将自动优化捆绑包。

instant
英 [ˈɪnstənt] 美 [ˈɪnstənt]
adj.立即的;立刻的;速食的;即食的;速溶的;方便的
n.瞬间;片刻;某一时刻

bundle
英 [ˈbʌndl] 美 [ˈbʌndl]
n.(一)捆,包,扎;
optimize
英 [ˈɒptɪmaɪz] 美 [ˈɑːptɪmaɪz]
v.使最优化;充分利用

only one dependency 只有一个依赖

We test Create React App to make sure that all of its underlying pieces work together seamlessly – no complicated version mismatches.
我们对Create React App进行了测试,以确保其所有基础部分都能无缝协同工作-不会出现复杂的版本不匹配的情况。

piece
英 [piːs] 美 [piːs]
n.片;块;段;截;标准的量;碎片;碎块;零件;部件
v.修补;接合;凑合

seamless
英 [ˈsiːmləs] 美 [ˈsiːmləs]
adj.无(接)缝的;(两部分之间)无空隙的,不停顿的

seamlessly
无缝的;无缝;天衣无缝地;
complicate
英 [ˈkɒmplɪkeɪt] 美 [ˈkɑːmplɪkeɪt]
v.使复杂化

complicated
英 [ˈkɒmplɪkeɪtɪd] 美 [ˈkɑːmplɪkeɪtɪd]
adj.复杂的;难懂的
v.使复杂化

mismatch
英 [ˌmɪsˈmætʃ , ˈmɪsmætʃ] 美 [ˌmɪsˈmætʃ , ˈmɪsmætʃ]
n.误配;错配;搭配不当
v.使配错,使配合不当

No Lock-In 没有锁定

eject
英 [iˈdʒekt] 美 [iˈdʒekt]
v.驱逐;逐出;赶出;喷出;喷射;排出;(飞行员在飞机坠毁前从弹射座椅)弹出

Easy to Maintain 易于维护

maintain
英 [meɪnˈteɪn] 美 [meɪnˈteɪn]
v.维持;保持;维修;保养;坚持(意见);固执己见

typically
英 [ˈtɪpɪkli] 美 [ˈtɪpɪkli]
adv.通常;一般;典型地;具有代表性地;不出所料;果然
daunt
英 [dɔːnt] 美 [dɔːnt]
v.使胆怯;使气馁;使失去信心
daunting
英 [ˈdɔːntɪŋ] 美 [ˈdɔːntɪŋ]
adj.使人畏惧的;令人胆怯的;让人气馁的
v.使胆怯;使气馁;使失去信心
daunt的现在分词
time-consuming
英 [ˈtaɪm kənsjuːmɪŋ] 美 [ˈtaɪm kənsuːmɪŋ]
adj.费时的;耗时间的

getting started

Create a project, and you’re good to go.
创建一个项目,一切顺利。

creating an app

npx
npx create-react-app my-app
npm
npm init react-app my-app
yarn
yarn create react-app my-app
selecting a template

搜索template:npm上搜索:cra-template-。地址:https://www.npmjs.com/search?q=cra-template-*
template都是cra-template-开头的 ,但是安装的时候,直接用最后就行。
eg:一个typescript的模板:

npx create-react-app my-app --template typescript
selecting a package manager

默认是yarn,如果想更改:

npx create-react-app my-app --use-npm

folder structure

my-app/
  README.md
  node_modules/
  package.json
  public/
    index.html
    favicon.ico
  src/
    App.css
    App.js
    App.test.js
    index.css
    index.js
    logo.svg

available scripts

npm start
npm test
npm run build
npm run eject // 单向操作

supported browsers and features

use react-app-polyfill

npm install react-app-polyfill
//or
yarn add react-app-polyfill
// Internet Explorer 9
// This must be the first line in src/index.js
import 'react-app-polyfill/ie9';

Create React App is divided into two packages:

  • create-react-app
  • react-scripts
 类似资料:

相关阅读

相关文章

相关问答