From d305d9d73db2617ec46ccf71bb63ef036ca2196c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=88=E3=81=A6=E3=81=BF=E3=81=AA=E3=82=8B?=
 <47494433+eteeeeeerminal@users.noreply.github.com>
Date: Fri, 10 Sep 2021 00:33:44 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20github=20pages=E4=B8=8A=E3=81=A7?=
 =?UTF-8?q?=E7=94=BB=E5=83=8F=E3=81=8C=E8=AA=AD=E3=81=BF=E8=BE=BC=E3=82=81?=
 =?UTF-8?q?=E3=81=AA=E3=81=84=E3=83=90=E3=82=B0=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .github/workflows/push-feature.yml |  1 +
 .github/workflows/push-main.yml    |  1 +
 next.config.js                     | 15 ++++++++++++++-
 package-lock.json                  | 16 ++++++++++++++++
 package.json                       |  1 +
 src/components/image.tsx           |  7 ++++++-
 6 files changed, 39 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/push-feature.yml b/.github/workflows/push-feature.yml
index 75b421e..35d0e28 100644
--- a/.github/workflows/push-feature.yml
+++ b/.github/workflows/push-feature.yml
@@ -39,4 +39,5 @@ jobs:
       - run: npm run build
         env:
           CI: true
+          GITHUB_PAGES: true
       - run: npm run lint
diff --git a/.github/workflows/push-main.yml b/.github/workflows/push-main.yml
index c323499..47ea1df 100644
--- a/.github/workflows/push-main.yml
+++ b/.github/workflows/push-main.yml
@@ -37,6 +37,7 @@ jobs:
       - run: npm run build
         env:
           CI: true
+          GITHUB_PAGES: true
       - name: ビルド結果を GitHub Pages へ配置します。
         uses: peaceiris/actions-gh-pages@v3
         with:
diff --git a/next.config.js b/next.config.js
index 461da27..d8b5333 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,5 +1,18 @@
+const localDomain = '';
+const productDomain = 'https://virtualprogrammersnetwork.github.io';
+const productPath = '/vpn-website';
+const isProd = process.env.NODE_ENV === 'production';
+const isCI = !!process.env.CI;
+const path = isCI && isProd ? productPath : '';
+const assetPrefix = (isCI && isProd ? productDomain : localDomain) + path;
+
 /** @type {Partial<import('next/dist/next-server/server/config-shared').NextConfig>} */
-const providedExports = { future: { strictPostcssConfiguration: true } };
+const providedExports = {
+  assetPrefix,
+  basePath: path,
+  env: { assetPrefix },
+  future: { strictPostcssConfiguration: true },
+};
 
 /** @type {Partial<import('next/dist/next-server/server/config-shared').NextConfig>} */
 module.exports = providedExports;
diff --git a/package-lock.json b/package-lock.json
index 77cbda4..aeb679a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,6 +33,7 @@
         "babel-plugin-macros": "^3.1.0",
         "babel-plugin-twin": "^1.0.2",
         "browserslist": "^4.16.6",
+        "dotenv": "^10.0.0",
         "eslint": "^7.30.0",
         "eslint-config-airbnb-typescript": "^12.3.1",
         "eslint-config-next": "^11.0.1",
@@ -3266,6 +3267,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/dotenv": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
+      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/dset": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/dset/-/dset-2.1.0.tgz",
@@ -15089,6 +15099,12 @@
         "is-obj": "^2.0.0"
       }
     },
+    "dotenv": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
+      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "dev": true
+    },
     "dset": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/dset/-/dset-2.1.0.tgz",
diff --git a/package.json b/package.json
index 60d451b..366f7dc 100644
--- a/package.json
+++ b/package.json
@@ -49,6 +49,7 @@
     "babel-plugin-macros": "^3.1.0",
     "babel-plugin-twin": "^1.0.2",
     "browserslist": "^4.16.6",
+    "dotenv": "^10.0.0",
     "eslint": "^7.30.0",
     "eslint-config-airbnb-typescript": "^12.3.1",
     "eslint-config-next": "^11.0.1",
diff --git a/src/components/image.tsx b/src/components/image.tsx
index ce9928b..9b89f99 100644
--- a/src/components/image.tsx
+++ b/src/components/image.tsx
@@ -12,7 +12,12 @@ type Props = {
 const Img = ({ src, alt, width, height }: Props): JSX.Element => {
   return (
     <picture>
-      <img src={src} alt={alt} width={width} height={height} />
+      <img
+        src={`${process.env.assetPrefix}${src}`}
+        alt={alt}
+        width={width}
+        height={height}
+      />
     </picture>
   );
 };