Weex入门导读

2018-03-23

使用Weex开发Native App，对于纯展示类App确实很方便，前端人员开发很便捷，原生开发环境配置后基本一步到位。不过涉及到与原生的交互（含细节、硬件等），就需要Native介入。在开发Web端时，非内置组件、模块同样要进行Html扩展，这是因为虽然语法上和Html标签基本一致，但实际上都只是Weex提供的，而非Html标签。实际上，在多数Weex应用中，更多的是混合开发，Weex作为Native中Webview的增强替代，或者作为热更新的方案。不过相信随着Weex更新、第三方组件的不断加入， Write once, run anywhere！

Weex入门脑图

Weex中使用Vue脑图

问题：

Q1：npm & node.js 版本问题

A： npm要求v5.0+，通过

1	npm install -g npm

更新。参考Node升级到最新稳定版方法

Q2: “…cocoapods-build: No such file or directory”

A： 1、未安装请先安装CocoaPods；2、进入platforms/ios执行

1	pod install

Q3: 卡在“Setting up CocoaPods”

Update all pods
Updating local specs repositories
Setting up CocoaPods master repo
$ /usr/bin/git clone https://github.com/CocoaPods/Specs.git master –progress
14:04:02 : Reloading page…

A：这是因为淘宝镜像以及CocoaPods达200M之大，处理方式：

方法一、git clone方法安装cocoapods

1	cd ~/.cocoapods/repos // 进入该目录

若没有以上目录，执行下面指令，出现.cocoapods的目录后可以ctrl+c终止安装。

1	sudo gem install cocoapods // 常规的安装方法

进入到~/.cocoapods/repos的目录:

git clone https://github.com/CocoaPods/Specs
// 其他镜像：https://gitclub.cn/CocoaPods/Specs 推荐
//         https://git.coding.net/CocoaPods/Specs.git
//         https://code.aliyun.com/Magi/CocoaPods.git

完成后，执行[open .]打开当前目录repos。
然后把Specs目录改名为master即可。
注意目录为~/.cocoapods/repos/master/Specs的层级。
如果clone慢，直接上github下载到对应目录即可。

方法二、变更镜像（不推荐，超级超级慢，建议用上面那种方法安装）

1
2
3

$gem sources --remove https://rubygems.org/  // 移除现有Ruby默认源
$gem sources -a https://gems.ruby-china.org/ // 添加新镜像
$gem sources -l // 验证新源是否替换成功

安装CocoaPods:
(1) [sudo gem install cocoapods] 备注：苹果系统升级 OS X EL Capitan 后改为 [sudo gem install -n /usr/local/bin cocoapods]
(2) [pod setup]

更新gem

1	sudo gem update --system

Q4: Unable to add a source with url

[!] Unable to add a source with url git@github.com/CocoaPods/Specs.git named master-1.
You can try adding it manually in ~/.cocoapods/repos or via pod repo add.
14:55:18 : Buiding project…
BUILD FAILED

A：运行[pod setup]，如果失败运行[pod search afn]查看是否成功，成功则将项目目录下 platforms/ios/Pods/Podfile文件编辑修改source为“https://github.com/CocoaPods/Specs.git”。

Q5: iphone虚拟机运行正常，真机运行失败。

1	Error:weex don't support run on real device, please use simulator on Xcode.

A：无证书真机运行请参考iOS 无证书真机调试使用xcode打开项目目录下platforms/ios/WeexDemo.xcworkspace，对项目进行设置并运行。

Q6: no such file or directory, open ‘…demo/plugins/plugins.json 错误

11:44:18 : Adding ios weexpack-ios@4.1.6 …
11:44:18 : Success!
11:44:18 : Error: ENOENT: no such file or directory, open >’/Users/…/Documents/weex_project/yanxuan-weex-demo/plugins/plugins.json’

A：与toolkit版本有关，旧版本plugins中的默认文件只有Readme，新版本中只有plugins.json，默认内容为

{
  "ios": [],
  "web": [],
  "android": []
}

Q7: Entry, “:CFBundleIdentifier”, Does Not Exist 错误

A：对ios.config.json重新设置AppName、AppId后运行成功

参考文章

在线编写代码的平台
 代码示例(Examples)

Weex 和 React Native的区别和比较
 CocoaPods 的简单快速安装方法(Setting up CocoaPods master repo 卡着不动，是因为淘宝镜像已经不能用)
终端 setting up cocoapods master repo 不动
 如何用weexpack创建weex项目并构建app
Weex 入坑指南：手把手编译 Playground
iOS - 解决Unable to add a source with url https://github.com/CocoaPods/Specs.git named
Unable to add a source with url https://github.com/CocoaPods/Specs.git named master-1.
Failed to connect to GitHub to update the CocoaPods/Specs specs repo 问题
 网易严选App感受Weex开发–GitHub
iOS 无证书真机调试
 Weex 解决Print: Entry, “:CFBundleIdentifier”, Does Not Exist 错误方法
 Weex入门教程之7，从本地加载js、从服务器加载js文件显示
 一步步教你学Weex Android加载远程服务器配置

Miwi.Lin