Hello all,
I am new to Ionic and must say I am loving it at first glance but I have encountered a rather frustrating issue. I’m running through the ionic tutorial at https://ionicframework.com/docs/react/your-first-app although I’m sure this issue has appeared elsewhere:
TypeError [ERR_INVALID_ARG_TYPE]: The “path” argument must be of type string. Received type undefined
at validateString (internal/validators.js:112:11)
at Object.join (path.js:375:7)
at noopServiceWorkerMiddleware (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\react-dev-utils\noopServiceWorkerMiddleware.js:14:26)
at Layer.handle [as handle_request] (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\layer.js:95:5)
at trim_prefix (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:317:13)
at C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:284:7
at Function.process_params (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:335:12)
at next (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:275:10)
at launchEditorMiddleware (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\react-dev-utils\errorOverlayMiddleware.js:20:7)
at Layer.handle [as handle_request] (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\layer.js:95:5)
at trim_prefix (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:317:13)
at C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:284:7
at Function.process_params (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:335:12)
at next (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\index.js:275:10)
at handleWebpackInternalMiddleware (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\react-dev-utils\evalSourceMapMiddleware.js:42:7)
at Layer.handle [as handle_request] (C:\Users\User\Documents\dev\tideinfo_app_ionic_gallery\photo-gallery\node_modules\express\lib\router\layer.js:95:5)
Here are the commands I have ran to get to where I am. I have ran ionic serve for the first time and this is what I see.
npm install -g @ionic/cli native-run cordova-res
ionic start photo-gallery tabs --type=react --capacitor
cd photo-gallery
npm install @ionic/react-hooks @ionic/pwa-elements
Then I add:
import { defineCustomElements } from ‘@ionic/pwa-elements/loader’;
// Call the element loader after the platform has been bootstrapped
defineCustomElements(window);
to src/index.tsx as per instructions.
I’ve looked at various posts on this and can find similar but none which address my issue. Being a noob I am struggling. Having read various posts my money would be on it being related to node/react versions etc. Here are relevant environment details:
node v12.13.1
npm 6.12.1
windows 10.
Any ideas would be appreciated. Thanks.