Ionic Framework + Phonegap Build: workflow

2

To jest moja własna próba odpowiedzi to (proszę mi pomóc aktualizować to więc każdy może korzystać):

Zbuduj swoją aplikację z jońskich:

ionic start myApp sidemenu 
etc...

W domyślnie Ionic app plik config.xml znajduje się w katalogu głównym, nad folderem www/, więc przenieś go do folderu www/ w celu budowy Phonegap, aby go znaleźć.

mv config.xml www/

Następnie zip folder www/ lub git push to z komputera lokalnego do zdalnego git repo, które zostało połączone z PhoneGap Build. Tylko spakuj ten folder lub go popchnij, ponieważ jeśli pozwolisz innym katalogom obecnym w jonowym katalogu głównym, takim jak node_modules, twoja aplikacja będzie zbyt duża do kompilacji na Kompilacji Phonegap.

Następnie skompiluj na kompilacji Phonegap.

Źródło

2015-04-02 08:33:04 Louis

5

Po walce przez całą noc i cały ranek wymyśliłem hacke rozwiązanie.
Mam nadzieję, że to komuś pomaga.

Jako jonowego v1.0, przynajmniej dla mojego uproszczonego projektu, największa różnica jest tylko

config.xml
wszystkie aktywa graficzne są w ./resources

Co zrobiłem:
zmiany config.xml:

utworzony nowy plik w .www/config_phonegap.xml podstawie config.xml
w węźle widget zmienił nazw do PhoneGap (xmlns: luka = "http://phonegap.com/ns/1.0")
używany wyszukiwania regex zastąpić zmienić wszystkie ikony i zachlapanie tagów do odpowiedniego PhoneGap równoważnej
ręcznie stworzone niezbędne „luki: plugin” tagów dla jakichkolwiek wtyczek

haustem Dodatki:

stworzył zadanie haustem skopiować .www/w ./phonegap folderze
zadanie haustem kopiuje również ponad zasobów
łyk nad config_phonegap.xml i zmienia jej nazwę jako config.xml
haustem zadanie zip nasz nowy folder www. (w pliku zip nie powinno być żadnego najwyższego poziomu www.my tylko chcemy zip zawartość WWW)

Oznacza to, że mój build workflow (aż muszę zmienić coś w config.xml) teraz wygląda tak:

gulp phonegap
przesyłanie phonegap.zip do https://build.phonegap.com

oczywiście wiele obszaru do poprawy tutaj, ale potrzebowałem czegoś można używać do publikowania teraz. Przed zrobieniem statycznego pliku config_phonegap.xml odkryłem kilka pomysłów takich jak parsowanie xml w JS lub tworzenie pliku XSLT. Z powodu wysiłku, wydawało się, że w tym momencie jest niski zwrot, więc nie poszedłem dalej.

Oto odpowiednie bity kodu dla odniesienia
Regex:

### icon regex 
# android 
<icon src="([\.\w\\-]+)" density="([\w-]+)"/> 
<icon src="$1" gap:platform="android" gap:qualifier="$2"/> 

# ios 
<icon src="([@\.\w\\-]+)" width="([\d]+)" height="([\d]+)"/> 
<icon src="$1" gap:platform="ios" width="$2" height="$3" /> 


### splash regex 
# android 
<splash src="([\.\w\\-]+)" density="([\w-]+)"/> 
<gap:splash src="$1" gap:platform="android" gap:qualifier="$2" /> 

#ios 
<splash src="([[email protected]\.\w\\-]+)" width="([\d]+)" height="([\d]+)"/> 
<gap:splash src="$1" gap:platform="ios" width="$2" height="$3" />

próbka PhoneGap kompatybilny config.xml:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?> 
<widget id="com.yadda.yadda" version="2.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0"> 
    <name>my app name</name> 
    <description> 
     la di da desc 
    </description> 
    <author email="[email protected]" href="https://harhar.com/">w--</author> 

    <content src="index.html"/> 
    <access origin="*"/> 

    <preference name="webviewbounce" value="false"/> 
    <preference name="UIWebViewBounce" value="false"/> 
    <preference name="DisallowOverscroll" value="true"/> 
    <preference name="BackupWebStorage" value="none"/> 
    <preference name="SplashScreen" value="screen"/> 
    <preference name="SplashScreenDelay" value="1500"/> 

    <icon src="resources/android/icon/drawable-ldpi-icon.png" gap:platform="android" gap:qualifier="ldpi"/> 
    <icon src="resources/android/icon/drawable-mdpi-icon.png" gap:platform="android" gap:qualifier="mdpi"/> 
    <icon src="resources/android/icon/drawable-hdpi-icon.png" gap:platform="android" gap:qualifier="hdpi"/> 
    <icon src="resources/android/icon/drawable-xhdpi-icon.png" gap:platform="android" gap:qualifier="xhdpi"/> 
    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" gap:platform="android" gap:qualifier="xxhdpi"/> 
    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" gap:platform="android" gap:qualifier="xxxhdpi"/> 
    <gap:splash src="resources/android/splash/drawable-land-ldpi-screen.png" gap:platform="android" gap:qualifier="land-ldpi" /> 
    <gap:splash src="resources/android/splash/drawable-land-mdpi-screen.png" gap:platform="android" gap:qualifier="land-mdpi" /> 
    <gap:splash src="resources/android/splash/drawable-land-hdpi-screen.png" gap:platform="android" gap:qualifier="land-hdpi" /> 
    <gap:splash src="resources/android/splash/drawable-land-xhdpi-screen.png" gap:platform="android" gap:qualifier="land-xhdpi" /> 
    <gap:splash src="resources/android/splash/drawable-land-xxhdpi-screen.png" gap:platform="android" gap:qualifier="land-xxhdpi" /> 
    <gap:splash src="resources/android/splash/drawable-land-xxxhdpi-screen.png" gap:platform="android" gap:qualifier="land-xxxhdpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-ldpi-screen.png" gap:platform="android" gap:qualifier="port-ldpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-mdpi-screen.png" gap:platform="android" gap:qualifier="port-mdpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-hdpi-screen.png" gap:platform="android" gap:qualifier="port-hdpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-xhdpi-screen.png" gap:platform="android" gap:qualifier="port-xhdpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" gap:platform="android" gap:qualifier="port-xxhdpi" /> 
    <gap:splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" gap:platform="android" gap:qualifier="port-xxxhdpi" /> 

    <icon src="resources/ios/icon/icon.png" gap:platform="ios" width="57" height="57" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="114" height="114" /> 
    <icon src="resources/ios/icon/icon-40.png" gap:platform="ios" width="40" height="40" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="80" height="80" /> 
    <icon src="resources/ios/icon/icon-50.png" gap:platform="ios" width="50" height="50" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="100" height="100" /> 
    <icon src="resources/ios/icon/icon-60.png" gap:platform="ios" width="60" height="60" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="120" height="120" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="180" height="180" /> 
    <icon src="resources/ios/icon/icon-72.png" gap:platform="ios" width="72" height="72" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="144" height="144" /> 
    <icon src="resources/ios/icon/icon-76.png" gap:platform="ios" width="76" height="76" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="152" height="152" /> 
    <icon src="resources/ios/icon/icon-small.png" gap:platform="ios" width="29" height="29" /> 
    <icon src="resources/ios/icon/[email protected]" gap:platform="ios" width="58" height="58" /> 
    <icon src="resources/ios/icon/icon-[email protected]" gap:platform="ios" width="87" height="87" /> 
    <gap:splash src="resources/ios/splash/[email protected]~iphone.png" gap:platform="ios" width="640" height="1136" /> 
    <gap:splash src="resources/ios/splash/Default-667h.png" gap:platform="ios" width="750" height="1334" /> 
    <gap:splash src="resources/ios/splash/Default-736h.png" gap:platform="ios" width="1242" height="2208" /> 
    <gap:splash src="resources/ios/splash/Default-Landscape-736h.png" gap:platform="ios" width="2208" height="1242" /> 
    <gap:splash src="resources/ios/splash/[email protected]~ipad.png" gap:platform="ios" width="2048" height="1536" /> 
    <gap:splash src="resources/ios/splash/Default-Landscape~ipad.png" gap:platform="ios" width="1024" height="768" /> 
    <gap:splash src="resources/ios/splash/[email protected]~ipad.png" gap:platform="ios" width="1536" height="2048" /> 
    <gap:splash src="resources/ios/splash/Default-Portrait~ipad.png" gap:platform="ios" width="768" height="1024" /> 
    <gap:splash src="resources/ios/splash/[email protected]~iphone.png" gap:platform="ios" width="640" height="960" /> 
    <gap:splash src="resources/ios/splash/Default~iphone.png" gap:platform="ios" width="320" height="480" /> 

    <icon src="icon.png"/> 
    <gap:splash src="splash.png" /> 

<!-- so android doesnt' go bat shit crazy --> 
    <preference name="permissions" value="none"/> 

<!-- plugins --> 
    <feature name="StatusBar"> 
    <param name="ios-package" value="CDVStatusBar" onload="true"/> 
    </feature> 
<gap:plugin name="cordova-plugin-statusbar" source="npm" version="1.0.0"> 
    <param name="onload" value="true" /> 
</gap:plugin> 
<gap:plugin name="cordova-plugin-splashscreen" source="npm" version="2.0.0" /> 
</widget>

haustem zadania:

// **** Build phonegap *****/ 
var PHONEGAP_BUILD_FOLDER = '../phonegap', 
     PHONEGAP_RAW_FOLDER = 'www', 
     IONIC_SOURCE_FOLDER = './www', 
     IONIC_RESOURCE_FOLDER = './resources' 
     PHONEGAP_ZIP_FILE = 'phonegap_build.zip'; 

gulp.task('phonegap', function(cb){ 
    runSequence('clean_phonegap', 
       'copy_www', 
       'copy_resources', 
       'copy_phonegap_config_xml', 
       'copy_default_icon', 
       'copy_default_splash', 
       'zip_phonegap', 
       cb); 
}); 

gulp.task('clean_phonegap', function(cb){ 
    // clean our folder first 
    var phonegap_del_pattern = PHONEGAP_BUILD_FOLDER + '/*'; 
    del([phonegap_del_pattern], {force: true}, cb); 
}) 

gulp.task('copy_www', function(){ 
    var target_phonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER 
    return gulp.src([IONIC_SOURCE_FOLDER + '/**']) 
       .on('error', swallowError) 
       .pipe(gulp.dest(target_phonegap_folder)) 
}) 

gulp.task('copy_phonegap_config_xml', function(){ 
    var target_phonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER 
    return gulp.src(['config_phonegap.xml']) 
       .on('error', swallowError) 
       .pipe(rename('config.xml')) 
       .pipe(gulp.dest(target_phonegap_folder)); 
}) 

gulp.task('copy_resources', function(){ 
    var target_phonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER + '/resources', 
     exclude_pattern = '!' + IONIC_RESOURCE_FOLDER + '/_source_assets{,/**}' 

    // exclude pattern needs to go first. mother fucker. 
    return gulp.src([exclude_pattern, IONIC_RESOURCE_FOLDER + '/**']) 
       .on('error', swallowError) 
       .pipe(gulp.dest(target_phonegap_folder)); 
}) 

gulp.task('copy_default_icon', function(){ 
    var target_phonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER; 
    return gulp.src([IONIC_RESOURCE_FOLDER + '/ios/icon.png' ]) 
       .on('error', swallowError) 
       .pipe(gulp.dest(target_phonegap_folder)); 
}) 

gulp.task('copy_default_splash', function(){ 
    var target_phonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER; 
    return gulp.src([IONIC_RESOURCE_FOLDER + '/splash.png' ]) 
       .on('error', swallowError) 
       .pipe(gulp.dest(target_phonegap_folder)); 
}) 


gulp.task('zip_phonegap', function(){ 
    var sourcephonegap_folder = PHONEGAP_BUILD_FOLDER + '/' + PHONEGAP_RAW_FOLDER 
    return gulp.src(sourcephonegap_folder + '/**') 
     .pipe(zip('phonegap.zip')) 
     .on('error', swallowError) 
     .pipe(gulp.dest(PHONEGAP_BUILD_FOLDER)); 
})

Źródło

2015-06-02 19:28:46

0

w-- 's post był pomocny, ale naprawdę nie potrzebowałem tak wielu etapów do mojego zadania. Również mój config.xml wydaje się działać dobrze z PhoneGap Build. Tak, ten jeden łyk zadaniem będzie zip www i config.xml do pliku .zip:

gulp.task('phonegap_zip', function(){ 
    return gulp.src(['./www/**', './config.xml']) 
     .pipe(zip('phonegap.zip')) 

     .pipe(gulp.dest('./phonegap/')); 
});

Źródło

2015-08-28 01:09:35 Arlo

0

Jeżeli chcesz automatycznie wygenerować plik konfiguracyjny dla PhoneGap budować, użyj tego:

npm install pgb-config-maker --save 

./make-config-xml.sh

Następne polecenie:

phonegap remote build ios

Źródło

2015-11-02 19:30:53 siddiq

0

Możesz to zrobić z pakietem jonowym. Oferują 100 buildów/mo.

Docs dla niego dostępne są tutaj: http://docs.ionic.io/services/package/#summary

Jeśli trzeba wysłać go do iTunes Connect, można użyć tego: https://software.intel.com/en-us/forums/intel-xdk/topic/670364#comment-1895468

Źródło

2016-06-14 16:39:07

Ionic Framework + Phonegap Build: workflow

Odpowiedz

Powiązane problemy