vendredi 21 juillet 2017

Unable to Import React into .jsp Microservice

I created a .jsp microservice that is deployed on Google App Engine via intellij, and I'm trying to use ReactJS components from a Shopify UI Component Library called Polaris. I copied over the tutorial import statements as well as ReactDom.render snippets into my .jsp, but as I do not have .jsp experience nor ReactJS experience, despite the code compiling and deploying, I am unable to render anything within the render() function, and only receive a blank page. It seems that all the import statements are not registering, and when automatically trying to add dependencies to package.json via intellij, nothing happens. Please help! I have attached my index.jsp below.

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>

<html lang="en">
<head>
    <link rel="stylesheet" href="http://ift.tt/2uQKNZT">
    <title>Hello Shopify</title>
</head>
<body>
<div>
    <script>
        import {Button} from '@shopify/polaris';
        import React from 'react';
        import {render} from 'react-dom';
        import {Page, Card} from '@shopify/polaris';
        import {EmbeddedApp} from '@shopify/polaris/embedded';
        class MyApp extends React.Component {
        render() {
        return (
            <Page title="Example">
                <Card title="Online store dashboard">
                <button class="Polaris-Button">Example button</button>
            </Card>
            </Page>
        );
        }
        }
    </script>
</div>
</body>
    <script>
        ReactDOM.render
        (<EmbeddedApp
        shopOrigin="http://ift.tt/2vt6FaU"
        apiKey="a3d5fb2f90874953ca2f97ff0e94f4ce">
            <ResourcePicker open products onSelection={(resources) => console.log('Selected resources ', resources)}/>
        </EmbeddedApp>
        )
    </script>
</html>




Aucun commentaire:

Enregistrer un commentaire