1. 使用create-react-app建立react项目

create-react-app

全局安装create-react-appnode

npm install -g create-react-app

使用create-react-app建立一个项目react

$ create-react-app your-app 注意命名方式

Creating a new React app in /dir/your-app.

Installing packages. This might take a couple of minutes. 安装过程较慢,
Installing react, react-dom, and react-scripts...

若是不想全局安装,能够直接使用npxweb

$ npx create-react-app your-app    也能够实现相同的效果

这须要等待一段时间,这个过程实际上会安装三个东西npm

  • react: react的顶级库
  • react-dom: 由于react有不少的运行环境,好比app端的react-native, 咱们要在web上运行就使用react-dom
  • react-scripts: 包含运行和打包react应用程序的全部脚本及配置

出现下面的界面,表示建立项目成功:json

Success! Created your-app at /dir/your-app
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd your-app
  npm start

Happy hacking!

根据上面的提示,经过cd your-app命令进入目录并运行npm start便可运行项目。
生成项目的目录结构以下:react-native

├── README.md                            使用方法的文档
├── node_modules                    全部的依赖安装的目录
├── package-lock.json            锁定安装时的包的版本号,保证团队的依赖能保证一致。
├── package.json                    
├── public                                静态公共目录
└── src                                        开发用的源代码目录

代码的入口是项目目录下的index.jsapp

相关文章
相关标签/搜索