I understood that Ionic cannot handle 'yarn workspace' which build the project with react-app-rewired
https://github.com/ionic-team/ionic-cli/issues/4430
As suggested in this post, I configure my monorepo with the multi-app option( https://ionicframework.com/docs/cli/configuration#multi-app-projects)
To valide the project structure, I firstly tried to share a simple constants.
import * as ROLES from '../../../../lib/constants'
but when I launch ionic serve --project=app
Have got this error :
Module not found: You attempted to import ../../../../lib/constants which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.
Project structure :
ionic.config.json
{
"defaultProject": "myProject",
"projects": {
"app": {
"name": "My First Ionic App",
"type": "react",
"root": "packages/app",
"integrations": {
"capacitor": {}
},
}
}
}
How to manage to share files and components ?
Thank you
1条答案
按热度按时间9w11ddsr1#
Ok, after several day. I have an answer to build monorepo with Ionic & Capacitor !
1 - Build your monorepo with Yarn workspace this tutorial is simple and clear : https://jibin.tech/monorepo-with-create-react-app/ Then you will use
react-app-rewired
and not 'react-scriptsanymore 2 - Then do not use
ionic servethat use
react-scripts`3 - and Capacitor ! The command
ionic cap run
also usereact-scripts
then you have to find an alternativeThe answer is here https://capacitorjs.com/docs/guides/live-reload : Do not use the Ionic CLI
Capacitor supports CLIs with live reload capability.
Within capacitor.config.json, create a server entry then configure the url field using the local web server’s IP address and port:
"server": { "url": "http://192.168.1.68:8100", "cleartext": true },
Bonus : I created a script to automatically update capacitor.config.json https://gist.github.com/damienromito/e6b3930ffde4c7240f109d1de69febb5