Updating Dependencies
Every minor release we update dependencies to get the latest fixes and improvements. We do this early in the release cycle so that we have some more time to find regressions and issues. This is done on all folders with a package-lock.json, including:
- cht-core
- / (root)
- /admin
- /webapp
Steps
- Checkout and pull the latest default branch - get the latest code
- Make a branch:
git checkout -b "<issue>-update-dependencies"
- Take a look at the current list of dependencies related issues, where you can find the latest conversations and information.
Then for each folder go through these steps.
npm ci
- update your local node_modules to match expectednpm outdated
- report on any dependencies which aren’t at the latestnpm install --save[-dev] package@version
- install the latest version (be careful and read the release notes if the new version is a major change from the current)npm dedupe
- remove duplicated dependenciesnpm audit fix
- automatically fix any nested dependencies with vulnerabilitiesnpm audit
- get a report on any remaining vulnerabilities and manually scan it to see if there’s anything else you can do
Problems
- See issue #9770 for a list of the known dependencies that cannot be upgraded further because their latest versions only support ES Modules.
- Don’t update
bootstrap
to 4+ as it has many breaking changes. One day we will either raise an issue to upgrade it or migrate off it, but that is outside the scope of this change. - Don’t update
bootstrap-daterangepicker
. - Don’t update the
webapp
version ofjquery
to 3.6.0+ as theselect2
search input loses focus on click event, this is a known issue in their repository.- Note that the
webapp
webpack config is aliasing thejquery
package to make sure we only bundle one version of jquery. Currentlyenketo-core
is targeting3.6.3
, but we cannot take that version because of this select2 issue. - This select2 issue is actually resolved by upgrading to jquery
3.7+
, but we cannot move to that version because it is not compatible with our current version of enketo-core (7.2.5
).
- Note that the
- If you have trouble upgrading any other dependency and you think it’ll be challenging to fix it then raise a new issue with
Dependencies
tag, to upgrade just that dependency. Don’t hold up all the other upgrades you’ve made.
Troubleshooting
Angular exception
When upgrading Webapp’s Angular, you might get the following exception:
Running "exec:build-webapp" (exec) task
________________________________________
An unhandled exception occurred: Class extends value undefined is not a constructor or null
see "/private/var/folders/tx/lskdwi/T/ng-23kdi/angular-errors.log" for further details.
>> Exited with code: 127
This error is thrown by the Webpack’s subresource integrity. It’s likely that @angular/compiler
, @angular-devkit/build-angular
or @angular-builders/custom-webpack
aren’t resolved properly in the package-lock.json
.
To fix it, uninstall these 3 dependencies and then install them again in this order:
@angular/compiler
@angular-devkit/build-angular
@angular-builders/custom-webpack
If the error is still happening, try reinstalling @angular/cli
.
npm errno -17
If npm ci
errors with “errno -17” in shared-libs you may need to manually remove the nested dependencies from the package-lock.json. This needs move investigation to work out why this is happening.
select2 is not a function
If you get TypeError: "$(...).select2 is not a function"
then either:
- You bumped select2. For some reason this breaks it.
- You have multiple jquery libraries and select2 is getting attached to one but not the other. Make sure the jquery versions in enketo-core and webapp match and you’ve
run dedupe
to remove the enketo-core copy.
Feedback
Was this page helpful?
Glad to hear it! Please tell us how we can improve.
Sorry to hear that. Please tell us how we can improve.