1革为、新建項(xiàng)目
1总寒、命令行cd到項(xiàng)目根目錄 執(zhí)行 pod init
灭必,會創(chuàng)建一個pod配置文件.
2播瞳、用編輯器打開掸刊,加上 pod 'WeexSDK', :path=>'./sdk/'
3、下載最新的weexSDK
4赢乓、在ios目錄下有個sdk文件夾忧侧,把它復(fù)制到ios項(xiàng)目根目錄,和podFile里配置的路徑一致
5骏全、關(guān)掉xcode,在當(dāng)前目錄尼斧,命令行執(zhí)行
pod install
以后點(diǎn)擊xcworkspace文件打開項(xiàng)目.
6姜贡、創(chuàng)建一個新目錄weex,命令行cd到weex目錄棺棵,執(zhí)行weex init
楼咳,會提示你輸入項(xiàng)目名稱,自動創(chuàng)建的文件:
7熄捍、在當(dāng)前目錄命令行執(zhí)行npm install
,安裝依賴庫
創(chuàng)建一個文件夾js母怜,命令行執(zhí)行weex src -o js
生成最終需要的js文件
也可以weex src/main.we
在瀏覽器預(yù)覽
或者weex src/main.we --qr
生成二維碼余耽,用playground App
掃描預(yù)覽
加載weex
頁面
8、在weex目錄下苹熏,在終端開啟服務(wù)器
npm run dev //項(xiàng)目編譯
npm run serve //啟動輕量服務(wù)器
詳細(xì)請看WEEX快速入門中初始化程序
2碟贾、項(xiàng)目集成
在AppDelegate.m中
//
// AppDelegate.m
// LSWeexOCDemo
//
// Created by John_LS on 2016/11/11.
// Copyright ? 2016年 John_LS. All rights reserved.
//
#import "AppDelegate.h"
@interface AppDelegate ()
@end
@implementation AppDelegate
- (void)initWeex{
[WXAppConfiguration setAppName:@"LSWeexOCDemo"];
[WXAppConfiguration setAppGroup:@"LS"];
[WXAppConfiguration setAppVersion:@"1.0.0"];
[WXSDKEngine initSDKEnviroment];
}
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
[self initWeex];
// Override point for customization after application launch.
return YES;
}
- (void)applicationWillResignActive:(UIApplication *)application {
// Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state.
// Use this method to pause ongoing tasks, disable timers, and invalidate graphics rendering callbacks. Games should use this method to pause the game.
}
- (void)applicationDidEnterBackground:(UIApplication *)application {
// Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later.
// If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits.
}
- (void)applicationWillEnterForeground:(UIApplication *)application {
// Called as part of the transition from the background to the active state; here you can undo many of the changes made on entering the background.
}
- (void)applicationDidBecomeActive:(UIApplication *)application {
// Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface.
}
- (void)applicationWillTerminate:(UIApplication *)application {
// Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:.
}
@end
將要展示js文件放到項(xiàng)目中。
weex視圖控制器的初始化
ViewController.m:
//
// ViewController.m
// LSWeexOCDemo
//
// Created by John_LS on 2016/11/11.
// Copyright ? 2016年 John_LS. All rights reserved.
//
#import "ViewController.h"
#import <WeexSDK/WXSDKInstance.h>
@interface ViewController ()
@property (nonatomic, strong) WXSDKInstance *instance;
@property (nonatomic, strong) UIView *weexView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
_instance = [[WXSDKInstance alloc] init];
_instance.viewController = self;
_instance.frame=self.view.frame;
__weak typeof(self) weakSelf = self;
_instance.onCreate = ^(UIView *view) {
[weakSelf.weexView removeFromSuperview];
weakSelf.weexView = view;
[weakSelf.view addSubview:weakSelf.weexView];
};
_instance.onFailed = ^(NSError *error) {
NSLog(@"加載錯誤");
};
_instance.renderFinish = ^ (UIView *view) {
NSLog(@"加載完成");
};
[_instance renderWithURL: [NSURL URLWithString:[NSString stringWithFormat:@"file://%@/hello.js",[NSBundle mainBundle].bundlePath]]];
self.view.backgroundColor=[UIColor whiteColor];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (void)dealloc
{
[_instance destroyInstance];
}
@end
運(yùn)行展示的效果如圖:
上面的demo可以直接運(yùn)行weex服務(wù)器上面的
.we
文件轨域。
1袱耽、在mac上面構(gòu)建weex環(huán)境]
2、創(chuàng)建we文件
以上兩步均在前面的Weex的入門中有提到
3干发、終端中:cd到we文件的目錄下朱巨,通過終端命令weex -s .
架起weex服務(wù)器(不要丟掉.)
4、將上面demo中的url換成http://192.168.1.139:8081/list.we
,運(yùn)行可以看到結(jié)果枉长。