简体   繁体   English

aws 放大是否适用于 NextJS?

[英]Does aws amplify work with NextJS?

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我只是想用 NextJS 和 aws-amplify 运行一个基本的 hello world,但似乎是我 npm 安装这两个库的那一刻

aws-amplify & aws-amplify-react 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>
        )
    }
}

You need to make some kind of polyfill to avoid that window is not defined error.您需要制作某种 polyfill 以避免该window is not defined错误。 Also maybe you need to check your node_modules folder to see if react is correctly installed.也可能您需要检查您的node_modules文件夹以查看是否正确安装了react

The polyfill example: ``` polyfill 示例:```

(<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]; }
};

``` ``

Try this.试试这个。 Install tslib and then test安装tslib然后测试

npm install tslib npm 安装 tslib

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM