Title rewritten to: Missing error message: UserPoolId and ClientId are missing

Question

I'm looking into using cognito for amplify authentication in a vue js application, here is the code I added in main.js:

import Amplify from 'aws-amplify';
Amplify.configure({
      Auth: {
        mandatorySignIn: false,
        region: config.cognito.REGION,
        userPoolId: config.cognito.USER_POOL_ID,
        UserPoolClientId: config.cognito.APP_CLIENT_ID,
      },
    });

But somehow I got this error:

CognitoUserPool.js?17a7:46 Uncaught Error: Both UserPoolId and ClientId are required.
    at new CognitoUserPool (CognitoUserPool.js?17a7:46)
    at AuthClass.configure (Auth.js?bf82:183)
    at eval (Amplify.js?7d03:83)
    at Array.map (<anonymous>)
    at AmplifyClass.configure (Amplify.js?7d03:82)
    at eval (main.js?56d7:15)
    at Module../src/main.js (app.js:1692)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at Object.1 (app.js:2809)

I tried multiple methods following the reference video and aws amplify documentation. But still the same error occurs, my page is blank and error appears in the console. Checked the Auth options and all is good. How can I overcome this error? I'm also not using any client side secret hash because the js sdk doesn't work with the app client with a secret hash

Answer 1

The name of the configuration parameter needs to be as follows:

...
userPoolId: '...'
userPoolWebClientId: '...'
...

Define here: https://github.com/aws-amplify/amplify-js/blob/a047ce73abe98c3bf82e888c3afb4d2f911805f3/packages/auth/src/types/Auth.ts#L40