Document build process for Android and iOS

[mstenta]

I'd like to get set up with an Android APK build process on my laptop (Ubuntu), and document the steps for others.

[mstenta]

Changed the title to be more generally about documenting the build process for both Android and iOS apps.

[jgaehring]

I'm also going to try setting myself up with the Android and iOS SDK's next week. Before I can move ahead with PR #21 , and before committing any other changes to this repo after that, I think I need to be able to confirm these builds work.

For committing changes to the client, I think #22 should be helpful.

[alexadamsmith]

Fantastic - if you have any questions about setting up the build process, I'll be glad to help in any way I can!

…

On Fri, Apr 27, 2018 at 3:04 PM, James Gaehring ***@***.***> wrote: I'm also going to try setting myself up with the Android and iOS SDK's next week. Before I can move ahead with PR #21 <#21> , I think we need to confirm — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#14 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ARAC8KwF0XS2jl57xP3bhPvwg_0uXy0mks5ts2uzgaJpZM4S4pd9> .

[jgaehring]

So I've been digging through the Cordova docs and the Webpack configurations Alex put in place, and I think I've got a general feel now for how the build process should run. There are basically 2 steps: Webpack builds the html/css/js assets into a production ready web app (in /www), and then Cordova, with help from the platform SDK's (Android Studio & Apple's XCode), builds the /www folder into the full-blown Android and iOS installers (.apk and .ipa files, respectively).

The first snag I hit was running Webpack. This should work by simply running the npm script, npm run build-mobile, but I'm hitting a bunch of dependency issues. At a glance, these appear to be the same errors I was getting while I was working on separating out the repos, which required some changes to the Webpack config. That, along with the fact it spits out thousands of linter errors, even though I thought I'd disabled the linter long ago, tells me that there are some duplicate Webpack configurations, and that the changes I've been making to Webpack's base and dev configs aren't being reflected in (or are being overwritten by) the mobile config.

I'd still like to get a better understanding of the build process before I start cleaning up the Webpack and dependency stuff, so I'm generating a blank Cordova test app just to make sure I've got Cordova and the Android SDK set up properly (see Cordova's Android Platform Guide). As for the iOS SDK, I'll be somewhat limited in what I can do there, since I'm developing in Ubuntu (see "Developing an iOS App on Linux"). So for the time being, I'm just going to try to get the Cordova/Android process working, as a proof that Cordova in and of itself is working. Once I can get that test app to build, I'm planning to rewind the git head back to the last stable commit in the farmOS-native repo, back before the repo-split when Alex was able to build the first demo for Paicines, and try running a build of that. That way I can be pretty confident I know what all is required for our specific build.

All the while I'll be documenting the whole process.

After that, I'd really like to take a fresh look at our graph of dependencies between the two repos and figure out, once and for all, which repos get which deps, and which repos perform each part of the build process. More info on that in #7.

My feeling at this point is that it might just be easiest to re-scaffold the whole project from scratch, using the Cordova and Vue cli tools, add the main src files back in manually, and then reinstall any missing deps and config files as needed, based on what Webpack complains it's missing. That way, I can be sure we're not adding any unnecessary configuration or dependencies, as well as using all the latest package versions supported by the standard Vue and Cordova tools. An added bonus is that it should also give me chance to add and configure the linter and test suites, using the cli tools' recommended settings, which should make that whole process a lot easier.

[jgaehring]

Regarding:

The first snag I hit was running Webpack. This should work by simply running the npm script, npm run build-mobile, but I'm hitting a bunch of dependency issues. At a glance, these appear to be the same errors I was getting while I was working on separating out the repos, which required some changes to the Webpack config. That, along with the fact it spits out thousands of linter errors, even though I thought I'd disabled the linter long ago, tells me that there are some duplicate Webpack configurations, and that the changes I've been making to Webpack's base and dev configs aren't being reflected in (or are being overwritten by) the mobile config.

I don't have time right now to test this, but I think I've found the Webpack config that's responsible for this issue, so I'm just noting it here until I have time to follow up properly. When I separated the repos, I had to add some configuration to webpack.base.config.js, which can be seen in this diff. That config, however, is being overwritten by webpack.base-mobile.config.js. A quick fix would be to just copy & paste it into the mobile config, but I think this points to a more general problem in the way dependencies are managed and loaded between the 2 repos. This should be addressed in #7 .

[jgaehring]

Leaving some more notes for reference....

I went back and found the tutorial Alex used to initialize the project and setup the Webpack configuration: "Making work the Vue.js webpack template with cordova". I think I've found the problem with this setup which is leading to the duplication I mentioned in my previous comments.

The tutorial goes against Webpack best practices by copying the webpack.base.conf.js file itself and making changes in the copy, instead of using webpack-merge. The build-mobile script then points to the copy, not the base, which is now wholly ignored, kinda defeating the purpose of a base configuration. Found a good article on using merge: "Composing Configuration".

Again, I might defer reintegrating the config files until I've settled on a strategy for managing depdenencies, and meanwhile just go for the quick-fix of duplicating the configurations from webpack.base.conf.js. I'm opening #30 to track this related but separate issue.

[jgaehring]

After implementing that quick-fix in webpack.base-mobile.conf.js, I was finally able to successfully build the Android version based on the latest commits, which includes carmera functionality and is using the farmos-client repo as an npm dependency. The relevant updates to the docs are all in farmOS/farmOS.org#28, and I've merged PR #21 back into master, so I'm closing this issue.

There are likely still going to be bugs that need fixing, and corresponding updates to the docs, plus the longer term fix to webpack.base.conf.js, but those can now be tracked in separate issues.