ReactNative 环境配好了半年一直没尝试过,当初也就跑了个helloworld,是时候 把该补的工作补上去了。折腾了一天半,又熟悉了node.js git ,sublime 等等
1.sublime
虽然不需要激活,但是 默认的也是一个没多大用的核心--其他的功能都要以插件的形式装上去--就像Eclipse。
默认是没有Package Settings和Package Control两个菜单。
不要想通过命令行的形式---慢还不靠谱。
还是下载之后离线安装简单粗暴:
1.点击Preferences>Browse Packages菜单
2.进入打开的目录的上层目录,然后再进入Installed Packages/目录
3.下载Package Control.sublime-package并复制到Installed Packages/目录
4.重启 Sublime Text。
其他参考别人的建议React Native开发推荐的一些插件:
-
ReactJS : 支持React开发,代码提示,高亮显示 ,介绍地址:sublime-react
-
Emmet :前端开发必备。
-
Terminal : 在sublime中打开终端并定位到当前目录,神器,mac下的快捷键为:command+shift+T
-
react-native-snippets:react native 的代码片段,
打开sublime遇到一个提示
Sublime Text Error while loading PyV8 binary:exit code 1 Try to manually install Pyv8 form
https://github.com/emetio/pyv8-binaries
于是到网上寻找答案 解决方法如下:
-
去gihub下载 PyV8,连接地址:
-
进入 路径 C:\Users\UserName\AppData\Roaming\Sublime Text 2\Packages\PyV8 没有的文件夹新建
-
我自己的文件是 C:\Users\BianGX\AppData\Roaming\Sublime Text 3\Packages\PyV8 把下载的 pyv8-win64-p3 解压 拷贝进来就好了.
2.React native踩的大坑
新建项目必须要用Windows 下 win+X 命令行 创建新的项目必须用 管理员权限那个,其他的启动 并不需要
image.png
虽然 hello world 跑的通但是 还是要进阶看demo 采坑开始。
每个项目导入后 进入项目 root 都要执行
npm install react-native-cli
npm install -g (全局安装,为什么 每个都要来一次 虽然只要一次)
但是这速度是在不敢恭维,就算使用代理也很慢---可能物理距离太远,npm 太TM慢了怎么办 更换 淘宝的 服务器--好的感谢阿里爸爸--
$ npm install -g cnpm --registry=http://registry.npm.taobao.org
这个命令 使用淘宝的镜像--据说15分钟同步一次--所以 都是一样的。
image.png导入的是来自阿里开发人员,你的又一Github客户端哦~项目github也超过了1000个star。主要功能:
- Feeds like web github home. (Github个人主页)
- Search users or repos. (搜索用户或者开源库)
- Star, watch repos, follow guys. (start,watch库,follow用户)
- Explore trending repos daily, weekly, monthly. (查看浏览趋势)
- Check who's famous in some filed all of the world. (检查特殊的commit)
项目地址:https://github.com/xiekw2010/react-native-gitfeed
有个大小为-1b的包果然卡了十分钟, 肯定坏了那就从新再来一次,结果又十分钟还不好我也是醉了。
image.png
换到 Android Studio 来。。下了10分钟 都没有下完,
image.png
wtf.我换个项目还不行?
该为国外一个天气预报客户端,界面效果简约优美,项目地址:
https://github.com/stage88/react-weather
于是又下载 解压 安装。。。。。。。
终于到了再一次 run-android
找不到或无法加载主类?--好吧 看看gradle 的具体版本有问题--那么重新下载 放到 原路径:C:\Users\silencefun.gradle\wrapper\dists\gradle-2.10-all
gradle 的历个版本:https://gradle.org/releases/ image.png
根据提示 codepush.gradle 不存在于是到了路径下看了果然是个空的文件夹
于是 百度之;
安装Code-Push的命令行工具:
npm install -g code-push-cli
进入App根目录,运行一下命令:
npm install --save react-native-code-push@latest
然后再来一次。。。
漫长的七分钟 终于成功了
image.png
但是 第一次还没加载完又满屏的 红 WTF??看一下 服务的窗口OOM??
image.png我感到了代码对我深深的恶意--写法优雅优美的代码高高在上鄙视着你这个无能为力的码畜!
不能忍了------我再来一个,,差点给网速跪了
image.png
慢,那我再换一个。。。https://github.com/togayther/react-native-cnblogs 最近更新 几天以前,还不错
ping 值都300 我也很无奈啊
轻车熟路 安装:
image.png
执行 run-android ,
开始编译配置:
image.png
服务成功启动:
image.png image.png
最后 还是失败了--服务端问题 js 文件创建失败-但是Android端是正常的
image.png
刚好 那个 30days下完了,那么 再来一次(想认输么,哪那么容易?)
我还是认输了---自己的npm版本略低---又是一堆坑要填。
最后的最后,就算是自己跑demo,总算还是学点了经验:
1.在github看demo项目最后的维护时间---1month 甚至更久的以year为单位的 就不要去尝试了--技术更新太快,太多的 坑要一个个来填:有些方法都弃用了,有些方法改名了等等
2.不要一棵树吊死,不行就换一个,Windows本身坑就多啊----看来 mac book在向我招手。
3.把坑以及解决办法记下来,相信我,你还会再次遇到的---大神请无视。
4.熟悉命令行真的很重要也很有用--敲出来比点按键爽多了。
网友评论