WebGL 설정

package.json

@@ -9,9 +9,11 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/styles": "^4.11.4",
+    "axios": "^0.21.1",
     "next": "^11.0.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
+    "react-unity-webgl": "^8.4.6",
     "typescript": "^4.3.5"
   },
   "scripts": {

pages/dice/index.tsx

@@ -0,0 +1,33 @@
+import path from 'path';
+import Unity, {UnityContext} from 'react-unity-webgl';
+import {createStyles, makeStyles, Theme} from '@material-ui/core/styles';
+
+const useStyles = makeStyles((theme: Theme) =>
+    createStyles({
+      unity: {
+        width: '50vw',
+        height: '50vh',
+      }
+    }),
+);
+export default function Dice() {
+  const classes = useStyles();
+  const buildUrl = 'WebGL/Build';
+  // const buildUrl = 'http://localhost:8080/WebGL/Build';
+  const unityContext = new UnityContext({
+    loaderUrl: `${buildUrl}/WebGL.loader.js`,
+    dataUrl: `${buildUrl}/WebGL.data`,
+    frameworkUrl: `${buildUrl}/WebGL.framework.js`,
+    codeUrl: `${buildUrl}/WebGL.wasm`,
+    streamingAssetsUrl: "StreamingAssets",
+    companyName: "DefaultCompany",
+    productName: "DiceGame",
+    productVersion: "0.1",
+  });
+  return (
+      <Unity
+          unityContext={unityContext}
+          className={classes.unity}
+      />
+  );
+}

public/README.md

@@ -0,0 +1,2 @@
+# `WebGL 임시 설정`
+**public 폴더 안에 WebGL 폴더 배치 후 yarn dev 실행**