Open amenk opened 1 year ago
I believe this reason this is currently undocumented is due to the to put it politely poor quality of the current approaches to doing this.
Reforming this process and making it easier to development on these components is a goal. How that goal will be achieved is less clear
https://stackoverflow.com/a/63705440/288568
which leads to https://github.com/facebook/react/issues/14257#issuecomment-809702813 that looked very promissing
This did not help
cd ~/projects/otp-ui yarn cd node_modules/react yarn link cd ~/projects/otp-ui/packages/itinerary-body yarn link
cd ~/projects/otp-react-redux yarn link react yarn link @opentripplanner/itinerary-body
next try:
delete node_modules in otp-ui and otp-react-redux
cd ~/projects/otp-react-redux
yarn install
cd node_modules/react
yarn link
cd ../react-dom
yarn link
cd ~/projects/otp-ui/packages/itinerary-body
yarn link
yarn install
yarn link react
yarn link react-dom
cd ~/projects/otp-react-redux
yarn link @opentripplanner/itinerary-body
env YAML_CONFIG=`pwd`/config.yml yarn start
Search for a trip, open the trip details -> still crashes...
npm ls shows react 16 and react 17 mixed .. I guess this is part of the problem
otp-react-redux-feat-metric$ npm ls react
otp-react-redux@ /media/alex/bame/Projects/AddisMapTransit/otp-react-redux-feat-metric
├─┬ @auth0/auth0-react@1.6.0
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/base-map@3.0.6
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/core-utils@7.0.10
│ └─┬ @styled-icons/foundation@10.34.0
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/endpoints-overlay@2.0.5
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/from-to-location-picker@2.1.5
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/icons@2.0.1
│ └── react@16.14.0 deduped
├─┬ @opentripplanner/itinerary-body@4.1.5 -> ./../otp-ui/packages/itinerary-body
│ ├─┬ @opentripplanner/humanize-distance@1.2.0 -> ./../otp-ui/packages/humanize-distance
│ │ └─┬ react-intl@5.24.6
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ ├─┬ @opentripplanner/icons@2.0.1 -> ./../otp-ui/packages/icons
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons
│ ├─┬ @opentripplanner/location-icon@1.4.0 -> ./../otp-ui/packages/location-icon
│ │ ├─┬ @styled-icons/fa-regular@10.34.0
│ │ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon
│ ├─┬ @styled-icons/fa-solid@10.34.0
│ │ ├─┬ @styled-icons/styled-icon@10.6.3
│ │ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon
│ ├─┬ @styled-icons/foundation@10.34.0
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon
│ ├─┬ react-animate-height@3.0.4
│ │ ├─┬ react-dom@17.0.2 invalid: "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ │ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon
│ ├─┬ react-resize-detector@4.2.3
│ │ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ ├── react@17.0.2 invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
│ └─┬ styled-components@5.3.0
│ └── react@17.0.2 deduped invalid: "^16.14.0" from ../otp-ui/packages/itinerary-body, "^16.14.0" from ../otp-ui/packages/icons, "^16.14.0" from ../otp-ui/packages/location-icon, "^16.0.0" from ../otp-ui/packages/itinerary-body/node_modules/react-resize-detector
├─┬ @opentripplanner/location-field@1.12.11
│ └── react@16.14.0 deduped
With yalc I found some okayish workflow:
cd ~/projects/otp-ui/packages/itinerary-body
yarn tsc
yalc publish
cd ~/projects/otp-react-redux
yalc link @opentripplanner/itinerary-body
Now each time you change something in the package:
cd ~/projects/otp-ui/packages/itinerary-body
yarn tsc && yalc publish
might also need:
cd ~/projects/otp-ui/
yarn
yalc publish
Finally:
cd ~/projects/otp-react-redux
yalc update
yarn start
I'm not sure how I feel about adding another external tool as an "official" dependency, but I'm happy to discuss with other maintainers offline.
Either way glad you found a solution that works for you!
Does not seem to work for the @opentripplanner
dependencies of other @opentripplanner
components though ... not 100% sure.
I think I'll leave this issue open for now, but we'll hold off on updating the main README until we have a stronger solution. Glad you've found this yalc
approach though! Glad it works for you.
During development of the otp-react-redux app it is sometimes necessary to update OTP-UI components.
I tried with yarn link, but that is not fully working: See also https://github.com/opentripplanner/otp-react-redux/issues/716
Can we document a workable approach to do this?
I hope, if this process can be more smooth, this might attract also more (new) contributors.