Running an Ionic project on both Linux AND Mac

I develop on Ubuntu but to compile an iOS app I clearly need to do so from my Mac. I REALLY don’t want to develop on my Mac as it would completely break the workflow I’ve got for everything else I do and have established over years.

I would like to develop my Ionic apps on my Ubuntu machine and then just compile them on the Mac.

I’ve shared a folder from Ubuntu and can access it from my Mac. I have installed Ionic CLI on the Mac. However, I get errors when I try and do anything from the Mac terminal. Specifically, if I try and do something as simple as ionic serve I get:

Error: Cannot find module '../lib/init'

If I try and run ionic capacitor add ios I get:

Error: Cannot find module '../package.json'

If I do an ionic start xxx on the Mac everything works perfectly, but clearly that doesn’t work for projects I’ve already started on my Linux machine.

Is there a difference between ionic projects on Mac and Linux?

Is there a way to do what I want to here, please?

Thank you!

There will be a truckload of opinions on this

The one thing I learned while trying to compile on two machines using google drive share folders is that the node_modules folder contains stuff that is dependent on the hardware specs of the machine

So the least to try is to make sure they are different

Alternatively u can do a copy of the core src files to an alternative folder as part of the build workflow

Only then u need to manage some differences at root level likr package.json and config.xml etc

I guess ideally u want to git push and pull stuff to merge changes and so on

Thank you for this information. Glad I’m not going mad then :wink:

So it sounds like it would work having an Ionic project created on Linux and an Ionic project created on Mac, syncing the src folder from Linux to Mac and then running the build process seperately on each machine.

As long as I keep the npm packages in sync for both projects that should work?

Much appreciated.

What I did was initiate a new project on the android build machine and indeed copy src, but also assets, resources (I believe) and you need to copy the package.json and other config stuff as well. And run npm i before each build, in case you added a package.

Other way is to copy everything except node_modules, platforms and www (and I believe capacitor adds some stuff).

You need to try it out, but also be very disciplined about it - like cleaning assets folder so no unnecessary assets from old versions are used…

Depends a bit how much time you are willing to wait to get npm i to complete etc, as you are setting the project up from scratch ideally.

Again, others may have other views on how to work on single codebase with different machines…

/me raises hand

This is the entire reason version control systems exist.

Do not concern yourself with the details of how build systems work, because there is zero guarantee that what they do today will bear any resemblance to what they do tomorrow.

Push your changes to git, wherever they come from (I have a relatively similar setup to you, in that I do 95% of my work on Debian, but now and again something comes up on iOS specifically, or I just happen to be on the Mac). Pull them on the Mac and build. If you need to, find, adapt, or write a script that effectively does the work of a CI build system, so you can automate the Mac build process to a single command.

But I beg you: don’t try to figure out what to copy and what not to copy - you would be setting yourself up for a lifetime of needless pain.

I think the pain is manageable given the size of my projects and the learning curve which is also rewarding… but a local git server would do the trick even better indeed. Or private github account, etc…

Thank you both. I’ll have a play and see how I get on. :slight_smile:

OK, I think I’ve cracked it. For anyone else who has this issue the following approach seems to work.

  • Create a git repo (git, bitbucket, whatever)
  • Pull down the empty repo and ionic start myApp to create your app on Linux (or whatever OS you’re on)

When you do this a .gitignore file is created by default which excludes /node_modules and /dist so you can commit from the Linux machine without worrying about what node_modules will be required by Mac (if they differ as Tommertom mentioned. Also that you can ionic build --prod for each machine individually as the dist folder is ignored from source control.

  • ionic build --prod
  • ionic capacitor add android to add Android to the project
  • npx cap open android to open Android studio and test your project. Note that you’ll need to add "linuxAndroidStudioPath": "/usr/local/android-studio/bin/studio.sh" to your capacitor.config.json file to route this command properly.

You should now see your app running in Android Studio (assuming you have that installed).

Now for Mac…

  • Goto the git repo root folder and git add .
  • git commit -m "My first commit message"
  • git push

Check your repo. It shouldn’t have node_modules or dist files.

Move over to your Mac and…

  • Clone the repo
  • Go into the ionic project folder in the repo
  • npm install to install the node packages on the Mac (because they don’t get included in source control and could vary from machine to machine)
  • ionic build --prod
  • ionic capacitor add ios
  • npx cap open ios

This will add the correct dependencies to the ios folder, including the Pods stuff which I have yet to fully understand.

  • ionic cap open ios will launch XCode
  • Press the play button and you’ll see your project in the emulator.

You should now be able to make updates on either Mac or PC and push or pull from the repo to update the code. Because the node_modules and dist folders are not affected and the the android and ios folders were created on the native operating system updating the code shouldn’t affect them.

Unless I’ve missed anything??

Thanks for your help in getting to this point gentlemen.

1 Like

Congrats and thx for sharing the how-to.

Hopefully will be a classic

Advanced level will be to merge changes made on both machines and resolve

I believe this is called rebasing??

Yes, I think as long as I am careful not to affect the ios folder from Linux and android folder from the mac then the rest of the files are os agnostic (apart from node_modules), so hopefully this would just be a push pull thing most of the time. I’ll see how I get on though and if anything ‘interesting’ happens I’ll let you know :slight_smile:

I generally prefer merge over rebase simply because it’s harder to shoot oneself in the foot with it, but here’s FMTEYEWTK about the two.

1 Like