Does aws amplify work with NextJS? - amazon-web-services

Question

I am just trying to get a basic hello world running with NextJS and aws-amplify but it seems the moment I npm install the two libraries
aws-amplify & aws-amplify-react
I get 'react module missing' & window is not defined.
import React from 'react'
import Amplify from 'aws-amplify';
Amplify.configure({
Auth: {
// REQUIRED - Amazon Cognito Identity Pool ID
identityPoolId: 'XX-XXXX-X:XXXXXXXX-XXXX-1234-abcd-1234567890ab',
// REQUIRED - Amazon Cognito Region
region: 'XX-XXXX-X',
// OPTIONAL - Amazon Cognito User Pool ID
userPoolId: 'XX-XXXX-X_abcd1234',
// OPTIONAL - Amazon Cognito Web Client ID
userPoolWebClientId: 'XX-XXXX-X_abcd1234',
}
});
export default class extends React.Component {
static async getInitialProps({ req }) {
const userAgent = req ? req.headers['user-agent'] : navigator.userAgent
return { userAgent }
}
render() {
return (
<div>
Hello World
<style jsx>{`
`}</style>
</div>
)
}
}

Answer 1

You need to make some kind of polyfill to avoid that window is not defined error. Also maybe you need to check your node_modules folder to see if react is correctly installed.
The polyfill example:
```
(<any>global).window = (<any>global).window || {};
(<any>global).localStorage = (<any>global).localStorage || {
store: {},
getItem(key){
if (this.store[key]) {
return this.store[key];
}
return null;
},
setItem(key, value){
this.store[key] = value;
},
removeItem(key){ delete this.store[key]; }
};
```

Answer 2

Try this. Install tslib and then test
npm install tslib