文章目錄

• 坑人的 week 內建
• • 坑1
  • 坑2
  • 坑3
  • 坑4
  • 坑5 6 7 ...
• 正确姿勢
• 總結

坑人的 week 內建

本人經過兩天的時間終于把 week 內建到了項目之中，中間經過了非人的折磨，躺了無數的坑，進一個坑，把項目删了，告訴我這條路走不通，換條路接着走，撲街之後，在進行下一個方式。簡單的把我錯誤的方式介紹下，避免後人趟坑，最後把我成功的方式貼出來供大家參考。

坑1

看官網介紹，興沖沖的看到了一種方式，隻需要下載下傳源碼，然後把一個檔案拖到項目中，就可以實作了，建項目，git 源碼，期間發現官網給的位址已經不可用，自己去 github 上面找了新的位址，為自己暗自高興，這還不是兩三個小時搞定的事情，到最後才發現，那隻是 Devtools 的繼承方式，因為不仔細看文檔，撲街了。這個純粹自己的原因，不過也希望淘寶更新下文檔，至少下載下傳連接配接是最新的嘛。

坑2

又仔細看了看文檔，發現有一個內建 Weex 到已有應用，大大懊悔自己沒有好好的看文檔，按着教程，應該很快就可以搞定，上面提供了三種pod carthage git 本人比較熟悉 git，先嘗試了 git 方式，下載下傳了源碼，同理，位址還是自己去 github 上找的。按照教程打開 WeexSDK 項目，

有一個 WeexSDK 的 framework 編譯，在項目的下面果然出現了兩個WeexSDK.framework的檔案，不知道為啥是兩個，點進去，發現指向的都是一個檔案，lipo -info 檢視 cpu 類型，支援arm64 想着再生成一個 x86的 framework 就完美了，開始折騰，失敗（應該是自己對 framrwork 的合成不太熟悉導緻），學習了一陣，合成成功，終于有舒了一口氣，把WeexSDK.framework引入到項目，引入必要的系統庫檔案，other-linker Flags 添加 -Objc ，到拷貝 native-bundle-main.js 檔案的時候編譯運作 ，怎麼也在他說的路徑找到那個檔案，先把 main.js 拷貝進去吧，竟然運作了起來，然後，項目完美的不加載任何東西。

選擇 WeexSDK_MTL進行編譯

坑3

git 方式，版本号去掉，下載下傳最新的 WeexSDK。下載下傳完成，編譯，編譯不起來，xcode10編譯方式更新，不知道是淘寶的問題，還是 xcode10的問題，發現一個 xcode10對 pod 支援的問題，不能用新的file->workspace setting ->build systems 選擇不帶 new 的，又倒騰了各種配置問題，總算能夠編譯了，運作崩潰。。。。

坑4

跑playground 工程，上面的步驟，git pod ，配置，編譯，運作，靠，竟然跑起來，總算松了一口氣，至少有個能給上司看的東西了，下一步就是按照 playground 工程的方式，繼承到自己的項目中就可以了。萬裡長征總算走了一大半了，事實證明，坑是填不完的，自己建了一個全新的項目，然後開始對照 playground 的項目配置自己的項目，拖檔案夾，拖檔案，配置路徑，配置項目配置，散亂的亂七八糟的檔案，最後我放棄了，根本編譯不起來，檔案引用用的絕對路徑，太多了，改不過來，放棄了。

坑5 6 7 …

正确姿勢

1 git clone https://github.com/apache/incubator-weex.git 下載下傳完整項目到自己的電腦，裡面包含iso ，web ，android 的全部項目，我們主要關注 ios 檔案，

2 建立項目，例如WeexTest

3 進入到WeexTest 的xcodeproj同目錄檔案下，pod init 建立 Podfile 檔案，放哪兒先不管。

4 進入到incubator-weex/ios目錄下，把 sdk 目錄真個全部拷貝到Podfile 同目錄下。

5 編輯 Podfile 如下

platform :ios, '8.0'

def common
	pod 'WeexSDK', :path=>'./sdk/'
end

target 'weekDingdang4' do
    common
end
           

我們編譯 WeexSDk，采用的是本地編譯，此時如果運作 pod install 會出現 WeexSDK.podspec檔案不存在的錯誤，我們從incubator-weex/檔案夾下面找到這個檔案，把它拷貝到WeekTest/sdk 目錄下，

此時打開這個檔案是如下的内容

# coding: utf-8
Pod::Spec.new do |s|

  s.name         = "WeexSDK"

  s.version      = "0.19.0"

  s.summary      = "WeexSDK Source ."

  s.description  = <<-DESC
                   A framework for building Mobile cross-platform UI
                   DESC

  s.homepage     = "https://github.com/alibaba/weex"
  s.license = {
    :type => 'Copyright',
    :text => <<-LICENSE
           Alibaba-INC copyright
    LICENSE
  }
  s.authors      = { "cxfeng1"      => "[email protected]",
                     "yangshengtao" => "[email protected]",
                     "kfeagle"      => "[email protected]"
                   }
  s.platform     = :ios
  s.ios.deployment_target = '8.0'
  s.source =  { :path => '.' }
  s.source_files = 'ios/sdk/WeexSDK/Sources/**/*.{h,m,mm,c,cpp,cc}'
  s.resources = 'pre-build/*.js','ios/sdk/WeexSDK/Resources/[email protected]'

  s.user_target_xcconfig  = { 'FRAMEWORK_SEARCH_PATHS' => "'$(PODS_ROOT)/WeexSDK'" }
  s.requires_arc = true
  s.prefix_header_file = 'ios/sdk/WeexSDK/Sources/Supporting Files/WeexSDK-Prefix.pch'

  s.private_header_files = 'ios/sdk/WeexSDK/Sources/Component/RecycleList/WXJSASTParser.h',
                           'ios/sdk/WeexSDK/Sources/Layout/WXScrollerComponent+Layout.h',
                           'weex_core/Source/**/*.{h,hpp}'

  s.xcconfig = { "OTHER_LINK_FLAG" => '$(inherited) -ObjC', 'GCC_PREPROCESSOR_DEFINITIONS' => 'OS_IOS=1' }

  s.frameworks = 'CoreMedia','MediaPlayer','AVFoundation','AVKit','JavaScriptCore','GLKit','OpenGLES','CoreText','QuartzCore','CoreGraphics'
  
  s.default_subspec='WeexCore'

  s.subspec 'WeexCore' do |w|
    w.source_files = 'weex_core/Source/base/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/core/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/wson/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/third_party/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/include/**/*.{h,hpp,m,mm,c,cpp,cc}'
    w.exclude_files = 'weex_core/Source/**/*android.{h,hpp,m,mm,c,cpp,cc}'

    w.xcconfig = { 'USER_HEADER_SEARCH_PATHS' => ['${PODS_ROOT}/Headers/Public/WeexSDK/core/**'] }
    w.header_mappings_dir = 'weex_core/Source'

    w.libraries = "c++"
  end

end

           

再次編譯 會出現找不到檔案的 bug，因為我們沒有修改它的檔案路徑，我們對照上面的檔案，把需要的 js檔案，weex_core檔案夾全部拷貝到sdk/目錄下，js檔案在incubator-weex/pre-build/目下，weex_core 在incubator-weex/目下。

6 編輯WeexSDK.podspec檔案

結果如下

# coding: utf-8
Pod::Spec.new do |s|

  s.name         = "WeexSDK"

  s.version      = "0.19.0"

  s.summary      = "WeexSDK Source ."

  s.description  = <<-DESC
                   A framework for building Mobile cross-platform UI
                   DESC

  s.homepage     = "https://github.com/alibaba/weex"
  s.license = {
    :type => 'Copyright',
    :text => <<-LICENSE
           Alibaba-INC copyright
    LICENSE
  }
  s.authors      = { "cxfeng1"      => "[email protected]",
                     "yangshengtao" => "[email protected]",
                     "kfeagle"      => "[email protected]"
                   }
  s.platform     = :ios
  s.ios.deployment_target = '8.0'
  s.source =  { :path => '.' }
  s.source_files = 'WeexSDK/Sources/**/*.{h,m,mm,c,cpp,cc}'
  s.resources = './*.js','WeexSDK/Resources/[email protected]'

  s.user_target_xcconfig  = { 'FRAMEWORK_SEARCH_PATHS' => "'$(PODS_ROOT)/WeexSDK'" }
  s.requires_arc = true
  s.prefix_header_file = 'WeexSDK/Sources/Supporting Files/WeexSDK-Prefix.pch'

  s.private_header_files = 'WeexSDK/Sources/Component/RecycleList/WXJSASTParser.h',
                           'WeexSDK/Sources/Layout/WXScrollerComponent+Layout.h',
                           'weex_core/Source/**/*.{h,hpp}'

  s.xcconfig = { "OTHER_LINK_FLAG" => '$(inherited) -ObjC', 'GCC_PREPROCESSOR_DEFINITIONS' => 'OS_IOS=1' }

  s.frameworks = 'CoreMedia','MediaPlayer','AVFoundation','AVKit','JavaScriptCore','GLKit','OpenGLES','CoreText','QuartzCore','CoreGraphics'
  
  s.default_subspec='WeexCore'

  s.subspec 'WeexCore' do |w|
    w.source_files = 'weex_core/Source/base/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/core/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/wson/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/third_party/**/*.{h,hpp,m,mm,c,cpp,cc}',
                    'weex_core/Source/include/**/*.{h,hpp,m,mm,c,cpp,cc}'
    w.exclude_files = 'weex_core/Source/**/*android.{h,hpp,m,mm,c,cpp,cc}'

    w.xcconfig = { 'USER_HEADER_SEARCH_PATHS' => ['${PODS_ROOT}/Headers/Public/WeexSDK/core/**'] }
    w.header_mappings_dir = 'weex_core/Source'

    w.libraries = "c++"
  end

end

           

然後 pod install 成功

7 把 js 檔案拖入到 build phases->Copy bundle Resouce 裡面，點選+ add other

下面就可以編譯 ，運作，調試 week 項目了。然後要不要入 vue.js的項目坑呢？？？？？？？

總結

縱觀自己的坑，一個錯誤犯了看文檔不仔細的毛病，由于被上司強制安排這個任務，打亂了本來的計劃，又接入過大量的其它發SDK，就認為這個接入也是大概相似的，結果，一路坑，一路泥的狼狽不堪，第二個還是有自己對 pod 的不了解，隻知道有這麼一個工具，從來沒有深入研究過，知其然不知起是以然，走了不少彎路，對于一個穩定的 SDK 夠用，對于一個滿是坑的文檔，隻能是跳進去，再跳出來了，不過也學了不少東西。