Add MFE related issues fixes in troubleshooting.html #1019
Conversation
docs/troubleshooting.rst
Outdated
| Can't override styles using Indigo Theme for MFEs | ||
| ------------------------------------------------- | ||
|
|
||
| The indigo theme can’t override the styles for MFEs directly. It overrides styles for edx-platform. In case of MFEs, `@edx/brand <https://github.com/openedx/brand-openedx>`_ is used to override styles and then add your customized ``@edx/brand`` package in tutor-indigo. In this way, styles can be overidden:: |
There was a problem hiding this comment.
nit: overrides the styles
docs/troubleshooting.rst
Outdated
| Can't override styles using Indigo Theme for MFEs | ||
| ------------------------------------------------- | ||
|
|
||
| The indigo theme can’t override the styles for MFEs directly. It overrides styles for edx-platform. In case of MFEs, `@edx/brand <https://github.com/openedx/brand-openedx>`_ is used to override styles and then add your customized ``@edx/brand`` package in tutor-indigo. In this way, styles can be overidden:: |
There was a problem hiding this comment.
In case of MFEs,
@edx/brand <https://github.com/openedx/brand-openedx>_ is used to override styles and then add your customized@edx/brandpackage in tutor-indigo
Let's break this sentence into two.
docs/troubleshooting.rst
Outdated
|
|
||
| When there is a need to customize the ``@edx/frontend-component-header`` or ``@edx/frontend-component-footer`` component, two things we have to care of to avoid dependency conflict error during ``npm`` installation. | ||
|
|
||
| 1. Identify the version of openedx are you using such as ``quince`` for example. |
There was a problem hiding this comment.
nit: are you using, such as quince, for example.
docs/troubleshooting.rst
Outdated
| When there is a need to customize the ``@edx/frontend-component-header`` or ``@edx/frontend-component-footer`` component, two things we have to care of to avoid dependency conflict error during ``npm`` installation. | ||
|
|
||
| 1. Identify the version of openedx are you using such as ``quince`` for example. | ||
| 2. Navigate to `learning <https://github.com/openedx/frontend-app-learning>`_ and `learner-dashboard <https://github.com/openedx/frontend-app-learner-dashboard>`_ MFEs repositories and checkout to branch ``quince``. Inspect which `header` and `footer` version is installed from `package.json`. One can choose any two MFEs or check in other MFEs as well |
There was a problem hiding this comment.
- Inspect which
headerandfooterversion is installed frompackage.json--> Inspect whichheaderandfooterversions are installed frompackage.json. - One can choose any two MFEs or check in other MFEs as well --> This needs some further context as it is unclear what this statement means.
| )) | ||
|
|
||
|
|
||
| NPM Dependency Conflict When overriding ``@edx/frontend-component-header`` or ``@edx/frontend-component-footer`` |
There was a problem hiding this comment.
Should we move this section to the tutor-mfe plugin? I think we should.
There was a problem hiding this comment.
It should at the very least also be there. Or, at least, a link from there to here. (Or vice-versa.)
| When there is a need to customize the ``@edx/frontend-component-header`` or ``@edx/frontend-component-footer`` component, two things we have to care of to avoid dependency conflict error during ``npm`` installation. | ||
|
|
||
| 1. Identify your openedx version, for example ``quince``. | ||
| 2. Navigate to `learning <https://github.com/openedx/frontend-app-learning>`_ and `learner-dashboard <https://github.com/openedx/frontend-app-learner-dashboard>`_ MFEs repositories and checkout to branch ``quince``. Inspect which `header` and `footer` versions are installed from `package.json`. You can explore the `header` and `footer` versions for additional MFEs to ensure that all MFEs support the same `major` versions of `header` and `footer`. |
There was a problem hiding this comment.
and checkout to branch
quince
should instead be:
and checkout to branch
open-release/quince.master
| When there is a need to customize the ``@edx/frontend-component-header`` or ``@edx/frontend-component-footer`` component, two things we have to care of to avoid dependency conflict error during ``npm`` installation. | ||
|
|
||
| 1. Identify your openedx version, for example ``quince``. | ||
| 2. Navigate to `learning <https://github.com/openedx/frontend-app-learning>`_ and `learner-dashboard <https://github.com/openedx/frontend-app-learner-dashboard>`_ MFEs repositories and checkout to branch ``quince``. Inspect which `header` and `footer` versions are installed from `package.json`. You can explore the `header` and `footer` versions for additional MFEs to ensure that all MFEs support the same `major` versions of `header` and `footer`. |
There was a problem hiding this comment.
Why are "header" and "footer" always surrounded by backticks? I don't think we need those, right?
|
|
||
| 1. Identify your openedx version, for example ``quince``. | ||
| 2. Navigate to `learning <https://github.com/openedx/frontend-app-learning>`_ and `learner-dashboard <https://github.com/openedx/frontend-app-learner-dashboard>`_ MFEs repositories and checkout to branch ``quince``. Inspect which `header` and `footer` versions are installed from `package.json`. You can explore the `header` and `footer` versions for additional MFEs to ensure that all MFEs support the same `major` versions of `header` and `footer`. | ||
| 3. Then, determine which versions of ``@edx/frontend-platform`` MFEs are utilizing and the header you plan to customize is compatible with the same version of ``@edx/frontend-platform`` specified in `package.json` file (peer-dependencies). |
There was a problem hiding this comment.
package.json should be surrounded by double backticks. (same below)
| @@ -193,3 +193,31 @@ Now build again:: | |||
| tutor images build | |||
|
|
|||
| All build commands should now make use of the newly configured builder. To later revert to the default builder, run ``docker buildx use default``. | |||
|
|
|||
| Can't override styles using Indigo Theme for MFEs | |||
There was a problem hiding this comment.
I think that this section should be moved to the tutor-indigo README.
There was a problem hiding this comment.
Shouldn't this also be under Troubleshooting guide? Thinking out loud, this would be the first-place ideally where the people might look to understand what actions would they need to do to override MFEs. I understand Troubleshooting is more related to core-related issues but was wondering that the other items can be useful for the community.
|
Moved the respective troubleshooting guides to their respective tutor plugins. Will include the links of those sections here. |
Add MFE related issues fixes in trroubleshooting. The issues has been grabbed from openedx-forum and have asked repeatedly.