Hey all! I’m a seasoned developer (30 years creating Web games in Director/Flash/CreateJS/PIXI) but brand new to Capacitor. I’m trying to port an HTML5 game to mobile. Have everything set up and can get the game to compile and run. I get into trouble when trying to import the admob plugin.
I have the following at the top of my main.js file:
import { AdMob } from ‘@capacitor-community/admob’;
And I get:
TypeError: Module name, ‘@capacitor-community/admob’ does not resolve to a valid URL.
I can see that the plugin is in a folder called node_modules - but the path won’t resolve. This is surely a setup issue of some kind (I feel I have followed the docs quite carefully). I am using very vanilla javascript in this project, so perhaps I’m not initializing the plugin correctly?
Thanks in advance for any guidance.
The issue you are encountering with importing the AdMob plugin in a vanilla JavaScript setup is a common hurdle. The error message:
TypeError: Module name '@capacitor-community/admob' does not resolve to a valid URL.
suggests that the module system in your current setup is not configured to handle ES module imports as expected.
- Make sure Proper Installation of the Plugin:
npm install @capacitor-community/admob
npx cap update
- Adjust Import Statement:
In a vanilla JavaScript context, when not using a bundler like Webpack or Rollup, ES module imports can be tricky. Instead of using the import statement, you might consider dynamically importing the module or accessing it via the global Capacitor.Plugins object.
(async () => {
const { AdMob } = await import('@capacitor-community/admob');
await AdMob.initialize();
// AdMob code here
})();
- Option B: Access via
Capacitor.Plugins
const { AdMob } = Capacitor.Plugins;
AdMob.initialize();
// AdMob code here
- Configure Development Environment:
If you are using a simple HTML file without a bundler, make sure that your script tag has the type="module" attribute:
<script type="module" src="main.js"></script>
- Consider Using Bundler:
For a smooth development experience & dealing with modules ==> setting up a bundler like Vite, Webpack, or Rollup. These tools handle module resolution and can simplify the integration of plugins like AdMob.
npm create vite@latest my-app --template vanilla
cd my-app
npm install
npm install @capacitor-community/admob
npx cap init
npx cap add android
npx cap sync
Update main.js
import { AdMob } from '@capacitor-community/admob';
AdMob.initialize();
// AdMob code here
Source: Capacitor AdMob Plugin Documentation, Creating Capacitor Apps with VanillaJS
Thanks so much!
This method seemed the fastest way to get rolling, and did work:
const { AdMob } = Capacitor.Plugins;
However, I’ve run into additional issues that may be outside the scope of the original question.
My implementation looks like this:
In index.html:
In main.js:
initApp = function() {
loadAdMob();
loadApp();
}
async function loadAdMob() {
const { AdMob } = Capacitor.Plugins;
await AdMob.initialize();
console.log("ADMOB 1");
const [trackingInfo, consentInfo] = await Promise.all([
AdMob.trackingAuthorizationStatus(),
AdMob.requestConsentInfo(),
]);
console.log("ADMOB 2");
if (trackingInfo.status === 'notDetermined') {
/**
* If you want to explain TrackingAuthorization before showing the iOS dialog,
* you can show the modal here.
* ex)
* const modal = await this.modalCtrl.create({
* component: RequestTrackingPage,
* });
* await modal.present();
* await modal.onDidDismiss(); // Wait for close modal
**/
await AdMob.requestTrackingAuthorization();
}
console.log("ADMOB 3");
const authorizationStatus = await AdMob.trackingAuthorizationStatus();
if (
authorizationStatus.status === 'authorized' &&
consentInfo.isConsentFormAvailable &&
consentInfo.status === AdmobConsentStatus.REQUIRED
) {
await AdMob.showConsentForm();
}
console.log("ADMOB 4");
}
In the Xcode log:
Failed to resolve host network app id to config: bundleID: com.apple.WebKit.Networking instance ID: Optional([_EXExtensionInstanceIdentifier: 3FA5BA8A-9F8F-4685-943B-89C692074255])
Loading app at capacitor://localhost…
Synchronous remote object proxy returned error: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Updating selectors failed with: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Updating selectors failed with: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Synchronous remote object proxy returned error: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Updating selectors failed with: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Synchronous remote object proxy returned error: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Updating selectors failed with: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
Updating selectors after delegate addition failed with: Error Domain=NSCocoaErrorDomain Code=4099 “The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.” UserInfo={NSDebugDescription=The connection to service named com.apple.commcenter.coretelephony.xpc was invalidated: failed at lookup with error 3 - No such process.}
-[RTIInputSystemClient remoteTextInputSessionWithID:performInputOperation:] Can only perform input operation for an active session. sessionID = 9865C411-7CC6-4BC7-A5BC-BCB75FACC18D
-[RTIInputSystemClient remoteTextInputSessionWithID:textSuggestionsChanged:] Can only set suggestions for an active session. sessionID = 9865C411-7CC6-4BC7-A5BC-BCB75FACC18D
-[RTIInputSystemClient remoteTextInputSessionWithID:textSuggestionsChanged:] Can only set suggestions for an active session. sessionID = 9865C411-7CC6-4BC7-A5BC-BCB75FACC18D
-[RTIInputSystemClient remoteTextInputSessionWithID:textSuggestionsChanged:] Can only set suggestions for an active session. sessionID = 9865C411-7CC6-4BC7-A5BC-BCB75FACC18D
To Native → AdMob initialize 37660066
TO JS {}
WebView loaded
[log] - PixiJS 5.3.12 - WebGL 1 - http://www.pixijs.com/
Error acquiring assertion: <Error Domain=RBSServiceErrorDomain Code=1 “(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)” UserInfo={NSLocalizedFailureReason=(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)}>
0x11104e340 - ProcessAssertion::acquireSync Failed to acquire RBS assertion ‘WebKit Media Playback’ for process with PID=36654, error: Error Domain=RBSServiceErrorDomain Code=1 “(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)” UserInfo={NSLocalizedFailureReason=(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)}
Error acquiring assertion: <Error Domain=RBSServiceErrorDomain Code=1 “(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)” UserInfo={NSLocalizedFailureReason=(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)}>
0x11104e400 - ProcessAssertion::acquireSync Failed to acquire RBS assertion ‘WebKit Media Playback’ for process with PID=36655, error: Error Domain=RBSServiceErrorDomain Code=1 “(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)” UserInfo={NSLocalizedFailureReason=(originator doesn’t have entitlement com.apple.runningboard.assertions.webkit AND originator doesn’t have entitlement com.apple.multitasking.systemappassertions)}
To Native → AdMob trackingAuthorizationStatus 37660067
[log] - ADMOB 1
To Native → AdMob requestConsentInfo 37660068
TO JS {“status”:“notDetermined”}
ERROR MESSAGE: {“message”:“Request consent info failed”,“errorMessage”:“Request consent info failed”}
[error] - {“message”:“Request consent info failed”,“errorMessage”:“Request consent info failed”}
AddInstanceForFactory: No factory registered for id <CFUUID 0x6000002c8040> F8BB1C28-BAE8-11D6-9C31-00039315CD46
Google:HTML 48 required SKAdNetwork identifier(s) missing from Info.plist. See [Enable SKAdNetwork to track conversions] (Privacy strategies | iOS | Google for Developers).
-[RTIInputSystemClient remoteTextInputSessionWithID:textSuggestionsChanged:] Can only set suggestions for an active session. sessionID = 9865C411-7CC6-4BC7-A5BC-BCB75FACC18D
Thanks again!
1 Like
Managed to uncover part of the solution…needed to create an IDFA explainer on AdMob. The adventure continues…