react项目创建

搭建react项目:
1、安装node,npm等
2、打开终端到文件目录,npm install -g create-react-app
3、创建项目:create-react-app 项目名称
!!!
create-react-app 执行慢的解决方法:
在使用 create-react-app my-app 来创建一个新的React应用,在拉取各种资源时,往往会非常慢,一直卡在那:

fetchMetadata: sill mapToRegistry uri http://registry.npmjs.org/whatwg-fetch
可以看到资源还是使用了 npmjs.org,解决方法是换成淘宝的资源:

$ npm config set registry https://registry.npm.taobao.org
-- 配置后可通过下面方式来验证是否成功
$ npm config get registry
-- 或 npm info express
!!!


4、创建项目成功后:
cd 项目
npm start(默认localhost:3000)
npm run build
npm test
npm run eject


重点来了(即上面几种指令的解释):
在package.json中:
只有三个依赖,分别是react,react-dom,react-scripts,依赖为什么这么少,
是因为像webpack,babel等等都是被creat react app封装到了react-scripts这个项目当中,包括基本启动命令 都是通过调用react-scripts这个依赖下面的命令进行启动的,
creat react app搭建出来的项目默认支持这4种命令,start以开发模式启动项目,build将整个项目进行构建,test进行测试,
eject将文件完整目录呈现,会将原本creat react app对webpack,babel等相关配置的封装弹射出来,如果我们要将creat react app配置文件进行修改,现有目录下是没有地方修改的,
此时,我们就可以通过eject命令将原本被封装到脚手架当中的命令弹射出来,然后就可以在项目的目录下看到很多配置文件。

建议:
安装完毕后,首先执行npm run eject;

补救方法:
先git add .
然后git commit -m “init”
然后再npm run eject

5、改变端口号(根据自己的需要):

在package.json里面配置:

"dev": "webpack-dev-server --open firefox --port 3000 --hot --host 127.0.0.1"
       <!-- 自动打开火狐浏览器,指定端口号,指定域名 -->

上一篇:Mac系统中python3.x库之jieba


下一篇:豆瓣电影的探索性分析实现