Amazon-cognito-identity-js: Webpack

[mikedizon]

How can I use this with webpack? Tried logging in a user but it seems that amazon-cognito-identity can't find jsbn despite it being imported ahead of it.

amazon-cognito-identity.min.js:19 Uncaught ReferenceError: BigInteger is not defined

It seems that amazon-cognito-identity is being loaded before jsbn, is there a way to reverse the order?

[behrooziAWS]

You should be able to reference jsbn prior to amazon-cognito-identity.min.js amazon-cognito-identity does not include any of the dependencies.

[lauterry]

Hi

In fact it is jsbn2 which need to be imported after jsbn because jsbn2 needs BigInteger.

For my part, I have the following error

jsbn2.js?f193**:597Uncaught ReferenceError: BigInteger is not defined

[mikedizon]

I caved in and just included the scripts in the html file. Not worth the
hassle of getting it to work with webpack. Hopefully this is resolved once
it comes out of beta

On Thursday, June 2, 2016, LAU Thierry [email protected] wrote:

Hi

In fact it is jsbn2 which need to be imported after jsbn because jsbn2
needs BigInteger.

For my part, I have the following error

jsbn2.js?f193**:597Uncaught ReferenceError: BigInteger is not defined

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/aws/amazon-cognito-identity-js/issues/48#issuecomment-223429030,
or mute the thread
https://github.com/notifications/unsubscribe/AABnnlvrGyua4FqDuXyTSVHU3YwFwnmuks5qH0vLgaJpZM4IpTkN
.

Sent from Gmail Mobile

[lauterry]

Making this lib work with webpack is a real nightmare !!
I lose so much time trying to do this ...

[sarah-pixvana]

@lauterry I did the same thing as mike and just included the scripts in my root index.html file. Then made a resources folder with jsbn.js, jsbn2.js, moment.js, and all other dependencies rather than installing them with npm install. It is a sloppy way of doing things but it was the only way to get things working with webpack.

[cravecode]

I finally got it working.

You can have Webpack append export details to the end of a file. This is useful for javascript libraries that weren't designed as modules. Using the exports-loader, we can expose specific variables/functions for the require process.

You'll need the imports-loader and exports-loader.

npm install imports-loader

npm install exports-loader

In your main entry point JS file (i.e.: main.js), you'll need to declare the results of the require in the global scope for the imports-loader to be able to reference them.

// In your main entry point js file.

// webpack.config.js is configured to export a series of variables that we'll also import into jsbn2 and the AWS SDK.
JsbnWrapper = require("./js/lib/utils/jsbn.js");
// Webpack.config.js will import variables into this file that were exported from jsbn.js.
require('./js/lib/utils/jsbn2.js');
// Set "sjcl" to the global scope.
sjcl = require('sjcl');
require('./node_modules/amazon-cognito-identity-js/dist/aws-cognito-sdk.min.js');
require('./node_modules/amazon-cognito-identity-js/dist/amazon-cognito-identity.min.js');

In your webpack.config.js file, you'll need to add the imports and exports settings for the jsbn, jsbn2, and amazon cognito files.

 /* ... 
Your webpack.config.js specific settings.
.... */

module.exports = {
 /* ... */
  module: {
    loaders: [
      {
        test: /jsbn\.js$/,
        loaders: [
          'exports?BigInteger=BigInteger',
          'exports?IntAt=intAt',
          'exports?Nbv=nbv',
          'exports?Montgomery=Montgomery',
          'exports?Nbi=nbi',
          'exports?Nbits=nbits'
        ]
      },
      {
        test: /jsbn2\.js$/,
        loaders: [
          'imports?BigInteger=>JsbnWrapper.BigInteger',
          'imports?nbi=>JsbnWrapper.Nbi',
          'imports?intAt=>JsbnWrapper.IntAt',
          'imports?nbv=>JsbnWrapper.Nbv',
          'imports?Montgomery=>JsbnWrapper.Montgomery',
          'imports?nbits=>JsbnWrapper.Nbits'
        ]
      },
      {
        test: /amazon-cognito-identity\.min\.js$/,
        loaders: [
          'imports?BigInteger=>JsbnWrapper.BigInteger'
        ]
      }
    ]
  }
};

[mikedizon]

It would be great if the AWS team could let us know when they think this will come out of beta before spending a few hours working on this approach.

On Sun, Jun 19, 2016 at 4:25 PM Brian Young

<
mailto:Brian Young [email protected]

wrote:

I finally got it working.

You can have Webpack append export details to the end of a file. This is useful for javascript libraries that weren't designed as modules. Using the exports-loader, we can expose specific variables/functions for the

require

process.

You'll need the
https://github.com/webpack/exports-loader
and
https://github.com/webpack/imports-loader
.

npm install imports-loader

npm install exports-loader

In your main entry point JS file (i.e.: main.js), you'll need to declare the results of the

require

in the global scope for the imports-loader to be able to reference them.

// In your main entry point js file.

// webpack.config.js is configured to export a series of variables that we'll also import into jsbn2 and the AWS SDK.

JsbnWrapper

require

(

"

./js/lib/utils/jsbn.js

"

);

// Webpack.config.js will import variables into this file that were exported from jsbn.js.

require

(

'

./js/lib/utils/jsbn2.js

'

);

// Set "sjcl" to the global scope.

sjcl

require

(

'

sjcl

'

);

require

(

'

./node_modules/amazon-cognito-identity-js/dist/aws-cognito-sdk.min.js

'

);

require

(

'

./node_modules/amazon-cognito-identity-js/dist/amazon-cognito-identity.min.js

'

);

In your

webpack.config.js

file, you'll need to add the imports and exports settings for the jsbn, jsbn2, and amazon cognito files.

/* ...

Your webpack.config.js specific settings.

.... */

module

.

exports

{

/* ... */

module

:

{ loaders

:

[ { test

:

/

jsbn

.

js

$

/

, loaders

:

[

'

exports?BigInteger=BigInteger

'

,

'

exports?IntAt=intAt

'

,

'

exports?Nbv=nbv

'

,

'

exports?Montgomery=Montgomery

'

,

'

exports?Nbi=nbi

'

,

'

exports?Nbits=nbits

'

] }, { test

:

/

jsbn2

.

js

$

/

, loaders

:

[

'

imports?BigInteger=>JsbnWrapper.BigInteger

'

,

'

imports?nbi=>JsbnWrapper.Nbi

'

,

'

imports?intAt=>JsbnWrapper.IntAt

'

,

'

imports?nbv=>JsbnWrapper.Nbv

'

,

'

imports?Montgomery=>JsbnWrapper.Montgomery

'

,

'

imports?nbits=>JsbnWrapper.Nbits

'

] }, { test

:

/

amazon-cognito-identity

.

min

.

js

$

/

, loaders

:

[

'

imports?BigInteger=>JsbnWrapper.BigInteger

'

] } ] } };

—

You are receiving this because you authored the thread.

Reply to this email directly,
https://github.com/aws/amazon-cognito-identity-js/issues/48#issuecomment-227018406
, or
https://github.com/notifications/unsubscribe/AABnnqjUfkHaCmGYvNN0pJBaXsFSfRe6ks5qNaXBgaJpZM4IpTkN
.

https://github.com/aws/amazon-cognito-identity-js/issues/48#issuecomment-227018406

[chetanme]

We cannot give the exact timeline for this but it the service will be generally available very soon.

[simonbuchan]

Edit:

Do not use any more. this was changed by #108, see example config there or doc update PR #117

Original

Here was my stab at it, not sure if it's _all_ necessary:

// webpack.config.babel.js
import {ProvidePlugin} from 'webpack';
const AWS_SDK_MAIN = 'aws-sdk/dist/aws-sdk.min';
const AWS_COGNITO_SDK_MAIN = 'amazon-cognito-identity-js/dist/aws-cognito-sdk.min.js';
const AMAZON_COGNITO_IDENTITY_MAIN = 'amazon-cognito-identity-js/dist/amazon-cognito-identity.min.js';

export default {
  resolve: {
    alias: {
      'aws-sdk$': AWS_SDK_MAIN,
      'aws-cognito-sdk$': AWS_COGNITO_SDK_MAIN,
      'amazon-cognito-identity-js$': AMAZON_COGNITO_IDENTITY_MAIN,
    },
  },
<snip normal entry, output>
  plugins: [
    new ProvidePlugin({
      AWS: AWS_SDK_MAIN,
      AWSCognito: AWS_COGNITO_SDK_MAIN,
    }),
  ],
  module: {
    noParse: [
      /aws-sdk/,
      /aws-cognito-sdk/,
    ],
    loaders: [
      {
        test: require.resolve(AWS_SDK_MAIN),
        loader: 'exports?AWS',
      },
      {
        test: require.resolve(AWS_COGNITO_SDK_MAIN),
        loader: 'exports?AWSCognito',
      },
      {
        test: require.resolve(AMAZON_COGNITO_IDENTITY_MAIN),
        loader: 'imports?jsbn,BigInteger=>jsbn.BigInteger,sjcl,dummy=sjcl/core/codecBytes,moment',
      },
      {
        test: require.resolve('sjcl/core/codecBytes'),
        loader: 'imports?sjcl',
      },
<snip my code>
    ],
  },
  devtool: 'source-map'
};

[itrestian]

Can you send a pull request for this? Thanks!

[OliverCuong]

my issue: window not defined
from amazon-cognito-identity-js/dist/amazon-cognito-identity.min.js
please help me!

[bedorlan]

$ npm install script-loader

require("script!./jsbn.js");
require("script!./jsbn2.js");
require("script!./sjcl.js");
require("script!./aws-cognito-sdk.min.js");
require("script!./amazon-cognito-identity.min.js");

[OliverCuong]

thank you verry much

2016-10-11 21:48 GMT+07:00 tcleu [email protected]:

@hungcuong0105 https://github.com/hungcuong0105 Have you figured out a
solution to your issue of "window not defined"?

I am encountering a similar issue with the following error:

ReferenceError: window is not defined
at e.o.value (/var/task/node_modules/amazon-cognito-identity-js/
dist/amazon-cognito-identity.min.js:19:22615)
at Response. (/var/task/node_modules/
amazon-cognito-identity-js/dist/amazon-cognito-identity.min.js:19:11223)
at Request. (/var/task/node_modules/aws-
sdk/lib/request.js:355:18)
at Request.callListeners (/var/task/node_modules/aws-
sdk/lib/sequential_executor.js:105:20)
at Request.emit (/var/task/node_modules/aws-sdk/lib/sequential_executor.
js:77:10)
at Request.emit (/var/task/node_modules/aws-sdk/lib/request.js:668:14)
at Request.transition (/var/task/node_modules/aws-
sdk/lib/request.js:22:10)
at AcceptorStateMachine.runTo (/var/task/node_modules/aws-
sdk/lib/state_machine.js:14:12)
at /var/task/node_modules/aws-sdk/lib/state_machine.js:26:10
at Request. (/var/task/node_modules/aws-
sdk/lib/request.js:38:9)

on the OnSuccess callback for cognitoUser.authenticateUser().

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/aws/amazon-cognito-identity-js/issues/48#issuecomment-252939624,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ATsymRh4UrC6ygxn_xbjyhiLQnN822Xbks5qy6G0gaJpZM4IpTkN
.