1.下载安装node.js,须要node.js环境。css
2.通过挑选,决定选择creat-react-app这个项目脚手架,而后输入指令安装 $ npm install -g create-react-appnode
3.建立项目,而后输入指令(my-app是名字,本身取) $ create-react-app my-app react
4.进入项目,而后输入指令 $ cd my-appwebpack
5.运行项目,而后输入指令 $ npm startios
6.选择react-router-dom这个路由,而后输入指令安装 $ npm install --save react-router-domweb
7.对比fetch和axios选择fetch,而后输入指令安装 $ npm install whatwg-fetch --savenpm
8.由于我是开发微商城项目,UI组件集成选择ant-design-mobile,而后输入指令安装 $ npm install antd-mobile --savejson
9.引入 react-app-rewired 并修改 package.json 里的启动配置 $ npm install react-app-rewired --save-devaxios
10.在项目根目录建立一个 config-overrides.js 用于修改默认配置,输入代码babel
module.exports = function override(config, env) { // do stuff with the webpack config... return config; };
11.安装按需加载组件代码和样式的 babel 插件并修改 config-overrides.js 文件 $ npm install babel-plugin-import --save-dev
const { injectBabelPlugin } = require('react-app-rewired');
module.exports = function override(config, env) { config = injectBabelPlugin(['import', { libraryName: 'antd-mobile', style: 'css' }], config); return config; };
12.用组件方式来写css $ npm install --save styled-components