Unable to use in esm package. Module not found: Can't resolve '@ionic/pwa-elements/loader/index.js'

[FreePhoenix888]

freephoenix888@FreePhoenix:~/Programming/deep/deep-memo-app$ npm list @stencil/core
@deep-foundation/deep-memo@0.0.0 /home/freephoenix888/Programming/deep/deep-memo-app
└── (empty)

How is stencil related to this package?

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://chat.stenciljs.com

Current behavior:

I got this error:

- info Collecting page data .Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/home/freephoenix888/Programming/deep/deep-memo-app/node_modules/@ionic/pwa-elements/loader' is not supported resolving ES modules imported from /home/freephoenix888/Programming/deep/deep-memo-app/node_modules/@deep-foundation/capacitor-camera/dist/hooks/use-permissions.js
Did you mean to import @ionic/pwa-elements/loader/index.cjs.js?

And changed import in capacitor-camera to this:

import { defineCustomElements } from "@ionic/pwa-elements/loader/index.js";

Now I get this error

./node_modules/@deep-foundation/capacitor-camera/dist/hooks/use-permissions.js
Module not found: Can't resolve '@ionic/pwa-elements/loader/index.js'

Note that I have also tried to use this import:

import { defineCustomElements } from "@ionic/pwa-elements/loader/index.cjs.js";

But I got this error because there is no such file:

Could not find a declaration file for module '@ionic/pwa-elements/loader/index.cjs.js'. '/home/freephoenix888/Programming/deep/capacitor-camera/node_modules/@ionic/pwa-elements/loader/index.cjs.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/ionic__pwa-elements` if it exists or add a new declaration (.d.ts) file containing `declare module '@ionic/pwa-elements/loader/index.cjs.js';`ts(7016)

Expected behavior:

Use your package in esm package without the errors described above

Steps to reproduce:

git clone https://github.com/deep-foundation/deep-memo-app &&
cd deep-memo-app &&
git checkout 6f0ef4bb33423028bf22f30ec9fa2ce0987d7ce4 &&
npm install &&
npm run build-adroid

Related code:

Other information:

freephoenix888@FreePhoenix:~/Programming/deep/deep-memo-app$ npx envinfo --system --npmPackages --markdown

## System:
 - OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
 - CPU: (12) x64 AMD Ryzen 5 2600 Six-Core Processor
 - Memory: 6.67 GB / 7.73 GB
 - Container: Yes
 - Shell: 5.1.16 - /bin/bash
## npmPackages:
 - @capacitor-community/contacts: ^5.0.3 => 5.0.3 
 - @capacitor-community/electron: ^4.1.2 => 4.1.2 
 - @capacitor/action-sheet: ^5.0.0 => 5.0.4 
 - @capacitor/android: ^5.0.0 => 5.0.5 
 - @capacitor/camera: ^5.0.0 => 5.0.4 
 - @capacitor/cli: ^5.0.0 => 5.0.5 
 - @capacitor/clipboard: ^5.0.0 => 5.0.4 
 - @capacitor/core: ^5.0.0 => 5.0.5 
 - @capacitor/device: ^5.0.0 => 5.0.4 
 - @capacitor/dialog: ^5.0.0 => 5.0.4 
 - @capacitor/geolocation: ^5.0.0 => 5.0.4 
 - @capacitor/haptics: ^5.0.0 => 5.0.4 
 - @capacitor/ios: ^5.0.0 => 5.0.5 
 - @capacitor/local-notifications: ^5.0.0 => 5.0.4 
 - @capacitor/motion: ^5.0.0 => 5.0.4 
 - @capacitor/network: ^5.0.0 => 5.0.6 
 - @capacitor/push-notifications: ^5.0.0 => 5.0.4 
 - @capacitor/screen-reader: ^5.0.0 => 5.0.4 
 - @capawesome/capacitor-file-picker: ^5.0.0 => 5.0.0 
 - @chakra-ui/react: ^2.5.5 => 2.7.1 
 - @deep-foundation/capacitor-camera: ^1.1.7 => 1.1.7 
 - @deep-foundation/capacitor-device: ^17.0.3 => 17.0.3 
 - @deep-foundation/capacitor-motion: ^5.2.0 => 5.2.0 
 - @deep-foundation/capacitor-network: ^0.1.4 => 0.1.4 
 - @deep-foundation/capacitor-voice-recorder: ^1.2.1 => 1.2.1 
 - @deep-foundation/deeplinks: ^0.0.278 => 0.0.278 
 - @deep-foundation/firebase-push-notification: ^18.2.0 => 18.2.1 
 - @deep-foundation/react-with-packages-installed: ^0.5.3 => 0.5.3 
 - @deep-foundation/store: ^0.0.19 => 0.0.19 
 - @emotion/react: ^11.10.6 => 11.11.1 
 - @emotion/styled: ^11.10.6 => 11.11.0 
 - @freephoenix888/deep-map-object: ^3.0.1 => 3.0.1 
 - @google-cloud/speech: ^5.4.0 => 5.5.0 
 - @google-cloud/vision: ^3.1.2 => 3.1.3 
 - @ionic/pwa-elements: ^3.2.2 => 3.2.2 
 - @kevincobain2000/json-to-html-table: ^1.0.4 => 1.0.4 
 - @octokit/rest: ^19.0.5 => 19.0.13 
 - @rjsf/chakra-ui: ^5.6.2 => 5.8.1 
 - @rjsf/core: ^5.6.2 => 5.8.1 
 - @rjsf/utils: ^5.6.2 => 5.8.1 
 - @rjsf/validator-ajv8: ^5.6.2 => 5.8.1 
 - @types/debug: ^4.1.8 => 4.1.8 
 - @types/hjson: ^2.4.3 => 2.4.3 
 - @types/react: ^18.0.33 => 18.2.15 
 - @types/serviceworker: ^0.0.62 => 0.0.62 
 - atob: ^2.1.2 => 2.1.2 
 - az: ^0.2.3 => 0.2.3 
 - buffer: ^6.0.3 => 6.0.3 
 - capacitor-voice-recorder: ^5.0.0 => 5.0.0 
 - case-anything: ^2.1.13 => 2.1.13 
 - dotenv: ^16.0.3 => 16.3.1 
 - dotenv-load: ^2.0.1 => 2.0.1 
 - events: ^3.3.0 => 3.3.0 
 - firebase: ^9.19.1 => 9.22.2 
 - framer-motion: ^6.5.1 => 6.5.1 
 - generate-schema: ^2.6.0 => 2.6.0 
 - hjson: ^3.2.2 => 3.2.2 
 - jest: ^29.5.0 => 29.5.0 
 - next: ^13.4.7 => 13.4.7 
 - next-env: ^1.1.1 => 1.1.1 
 - next-pwa: ^5.6.0 => 5.6.0 
 - next-transpile-modules: ^10.0.0 => 10.0.0 
 - react: ^18.2.0 => 18.2.0 
 - react-dom: ^18.2.0 => 18.2.0 
 - react-json-to-table: ^0.1.7 => 0.1.7 
 - react-json-view-lite: ^0.9.8 => 0.9.8 
 - ts-node: ^10.9.1 => 10.9.1 
 - typescript: 5.0.4 => 5.0.4 
 - typescript-json-schema: ^0.56.0 => 0.56.0 
 - uuid: ^9.0.0 => 9.0.0 
 - yargs: ^17.7.2 => 17.7.2