Impossible to setup a monorepo multi app project. #4093
Comments
|
Maybe @dwieeb who made that commit can shed some light on this. Thanks |
|
I can take a look, but I can't promise anything timely. I am busy with other priorities at the moment. From glancing over this, it's likely a bug. Will look more in depth at a later time. Always accepting PRs. Thanks! |
|
We had the same problem. In my opinion, ionic start in a multi app project should not a local angular.json, but a shared one beside the ionic.config.json as describe by @ignition42. Good news for whoever tried it, I found a working workaround. Ionic expects a package.json on app level. It is enough to just create an almost bar package.json there:
Important is only that the ionic:build script gets overwritten so that ionic can build it. |
|
@ignition42 I believe 4e8a226 fixes this issue. I used these steps: https://github.com/dwieeb/ionic-multiapp/commits/master Please try Ionic CLI 5.2.8 and let me know if it's better.
That is discussed in this issue: #4121 |
|
Do I understand it correctly. We have to change in Ionic that no package is required anymore or set a path to the root and single package.json in a monorepo. btw. The In short: We could extract the cordova property stuff in a separate file. And remove the dependency of package.json in every sub-project. For the config.xml we have to extract all unique properties which are different from app to app. But keeping the same dependencies. |
|
Is there are workaround? 🤔 To fool Ionic building the root with the Cordova stuff and package.json but trigger the Angular multi-app build. Or build the angular project first and then the Corodva manually. ... Any idea? |
|
Is there any update on this? |
This fixes a couple issues with multi-app and Cordova integrations in directories separate from a project's root. ref: #4093
|
@ignition42 @Domvel @Sina7312 I just pushed a commit which fixes a couple bugs related to this issue. I was able to create a project structure similar to the original post in my test repo: https://github.com/dwieeb/ionic-multiapp/tree/multiapp-4093. See the commits for steps. Couple notes:
Please let me know if I'm on the right track. If so, I'll make a release with the fixes for the discovered issues. Thanks! |
|
@dwieeb Thank you! :) I will look into that in the near future. Just for the overview, in my case I want a Ionic 4 app with Android Cordova and Angular. A monorepo with only one package.json (deps) and a single Cordova setup with variables to build. I've already done that with hacking. I have an official Angular workspace with only one package.json and config.xml (Cordova). And a node build script. I don't use the Ionic build scripts for Cordova. I guess this is still an issue. But anyway... I discontinued this project because of internal decisions. (Not because of the setup. Because of the conversion of the big project and deps compatibility. Anyway...) I'll test it in some free hours. ... |
|
Now I created a new repo by following this instructions. (without set a default project.) And it looks great 👍 (note: not fully tested for the real life usage.) But in the Finally it works. But see the issue of missing styles for the other app in Here is the project I followed the commands above. (without setting a default project). The |
|
New try to reproduce the styles error. New commands order and with default project:
Error: Maybe this is because the CLI adds the styles in the wrong app in my-monorepo.zip (see the angular.json app-id.styles array) |
|
@Domvel I believe the issue you're describing is that it's trying to add the styles to the same app, and I believe it's an issue with our schematics that's being fixed by this PR: ionic-team/ionic-framework#20768 |
|
Ionic / Cordova still not work correctly. On I created my multi-app workspace like: ng new --create-application=false --new-project-root='./apps' my-monorepo
cd my-monorepo/
ionic init --multi-app
ng generate application --minimal --prefix=app --routing --style=scss app-one
ng generate application --minimal --prefix=app --routing --style=scss app-two
ng add @ionic/angular --project=app-one
ng add @ionic/angular --project=app-two
cd apps/app-one/
ionic init app-one --type=angular --default --project-id=app-one
cd ..
cd ..
cd apps/app-two/
ionic init app-two --type=angular --default --project-id=app-twoThen adding cordova: ionic cordova platform add android --project=app-one
ionic cordova platform add android --project=app-twoWorkspace structure: The {
"projects": {
"app-one": {
"name": "app-one",
"integrations": {
"cordova": {
"root": "./"
}
},
"type": "angular",
"root": "apps/app-one"
},
"app-two": {
"name": "app-two",
"integrations": {
"cordova": {
"root": "./"
}
},
"type": "angular",
"root": "apps/app-two"
}
}
}Btw. I can't find any docs for the integrations > * > properties. I found the property Why only one Now I want to build the apk. It should access the root |
|
@y0nd0 That error is coming from Cordova, not the Ionic CLI. Cordova projects manage plugin versions and variables as well as other metadata in |
|
@dwieeb Thanks for the instructions! Fix for me was |
|
@stuartin Thanks for the feedback! I added that as a troubleshooting note. |
|
For anyone coming to this issue with Angular 12 with Node 16, I have worked through the references above and have a monorepo working as I would expect:
The issues around packages reported above come down to cordova requiring an ' npm init' to be run in the integrations output project. The one thing that appears to be missing and it may be a good thing is the angular build output doesn't make its way to the integrations www folder for the platforms to be built with the web assets. Either add as symlink for the dist output, or as I did, create a hook script. I have documented the steps I followed here |
Thanks @blackram , works fine! |
|
Came here while researching into the issues I faced while setting up an Ionic Angular with Capacitor integrations monorepo project. I then set it up with NX which went well, until I wanted to use This eventually led me to try and create a project template that uses only Ionic and Angular CLIs. You can check it out here. It's tested on Android and works fine. If someone can verify it on iOS, it'll be great. Thanks. |
Description:
I've been trying to setup a monorepo multi app project, I've read #3281 issue and most of the linked issues and commits, specially 2d53c99 and multi-app-projects.
And I think this is not working properly.
The
angular.jsonis as it should be for multiple projects, as @stupidawesome pointed in that issue (#3281) and myionic.config.jsonis like this:And I intend to a folder structure like this (or at least something that works):
The problem is that
ionic integrations enable cordova --add --project aclient-ionic-appgeneratesresourcesandconfig.xmlinsideapps/aclient/ionic-appand then automatically adds"integrations": { "cordova": {} }in the root ofionic.config.jsonouside ofprojects. I don't think that's the intended behaviour.Then I try
ionic cordova platform add ios --project aclient-ionic-appand throws an error:So, to fix it in a hacky way I moved manually the file
config.xmland theresourcesfolder intointegrations/aclient-ionic-app/cordovaas well as initiate a npm folder inside cordova and thus creating thepackage.json.Now running
ionic cordova platform add ios --project aclient-ionic-appinstalls cordova plugins correctly. But the part that runsionic cordova resources ios --forcefails.Ignoring that error by now I pass to the next thing and then, when I run
ionic cordova prepare ios --project aclient-ionic-appfails.Output with verbose:
Since before enabling cordova added
"integrations": { "cordova": {} }inionic.config.jsonI tried to add the root.It didn't help at all.
Last thing I tried is to copy all cordova files (
config.xml,node_modules,package-lock.json,package.json,platforms,plugins,resources,www) intoapps/aclient/ionic-app/and then runionic cordova prepare ios.Moving files around and trying to trick the system is not ideal, but I didn't think of any other way to make it work, I think this is broken or I might have missed something.
My
ionic info:The text was updated successfully, but these errors were encountered: