ファイル構造の整理・デプロイ設定の修正

ics-creative · Aug 20, 2024 · 410ae5f · 410ae5f
1 parent 4cbf24f
commit 410ae5f
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 23 deletions.
diff --git a/src/index.html b/src/index.html
@@ -4,20 +4,13 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Theatre.js デモ 目次</title>
+    <link rel="stylesheet" href="style.css" />
   </head>
 
   <body>
-    <main>
-      <nav>
-        <ul class="navigation">
-          <li>
-            <a href="./src/sample/">Theatre.jsのGUIお試しページへ</a>
-          </li>
-          <li>
-            <a href="./src/multiple-animation/">複数アニメーションの作例へ</a>
-          </li>
-        </ul>
-      </nav>
-    </main>
+    <nav class="navigation">
+      <a href="./sample/">Theatre.jsのGUIお試しページへ</a>
+      <a href="./multiple-animation/">複数アニメーションの作例へ</a>
+    </nav>
   </body>
 </html>
diff --git a/src/multiple-animation/index.html b/src/multiple-animation/index.html
@@ -4,6 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Theatre.js 作例</title>
+    <link rel="stylesheet" href="../style.css" />
+    <script type="module" src="main.js"></script>
   </head>
 
   <body>
@@ -26,9 +28,7 @@
     </main>
 
     <footer class="navigation">
-      <a href="../../">目次へもどる</a>
+      <a href="../">目次へもどる</a>
     </footer>
-
-    <script type="module" src="./main.js"></script>
   </body>
 </html>
diff --git a/src/multiple-animation/main.js b/src/multiple-animation/main.js
@@ -1,4 +1,3 @@
-import "../style.css"
 import * as THREE from "three";
 import studio from "@theatre/studio";
 import { getProject, types } from "@theatre/core";

diff --git a/src/sample/index.html b/src/sample/index.html
@@ -4,11 +4,11 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Theatre.js 導入方法サンプル</title>
+    <link rel="stylesheet" href="../style.css" />
+    <script type="module" src="sample.js"></script>
   </head>
 
   <body>
     <div id="app"></div>
-
-    <script type="module" src="./sample.js"></script>
   </body>
 </html>
diff --git a/src/sample/sample.js b/src/sample/sample.js
@@ -1,4 +1,3 @@
-import "../style.css"
 import * as THREE from "three";
 import studio from "@theatre/studio";
 import { getProject, types } from "@theatre/core";

diff --git a/src/style.css b/src/style.css
@@ -8,6 +8,7 @@ html {
   width: 100%;
   height: 100%;
   overflow-x: hidden;
+  background-color: #626269;
 }
 
 .kv {
@@ -90,7 +91,6 @@ html {
   flex-direction: column;
   padding: 32px;
   color: #ffdaf0;
-  background-color: #626269;
   border-top: solid 3px;
   border-image: linear-gradient(-45deg, #ffdaf0, #fff5db) 1;
 

diff --git a/vite.config.js b/vite.config.js
@@ -2,19 +2,18 @@ import { resolve } from "path";
 import { defineConfig } from "vite";
 
 const root = resolve(__dirname, "src");
-const outDir = resolve(__dirname, "dist");
 
 export default defineConfig({
   root,
   build: {
-    outDir,
+    outDir: resolve(__dirname, "dist"),
     rollupOptions: {
       input: {
         main: resolve(root, "index.html"),
         sample: resolve(root, "sample", "index.html"),
         multiple: resolve(root, "multiple-animation", "index.html"),
       },
     },
-    base: "/240827_theatrejs/",
   },
+  base: process.env.BASE_PATH ? "/240827_theatrejs/" : "./",
 });