diff --git a/.github/workflows/static.yml b/.github/workflows/static.yml new file mode 100644 index 0000000..29969bb --- /dev/null +++ b/.github/workflows/static.yml @@ -0,0 +1,61 @@ +# Simple workflow for deploying static content to GitHub Pages +name: Deploy static content to Pages + +on: + # Runs on pushes targeting the default branch + push: + branches: ["master"] + + # Allows you to run this workflow manually from the Actions tab + workflow_dispatch: + +# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages +permissions: + contents: read + pages: write + id-token: write + +# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. +# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. +concurrency: + group: "pages" + cancel-in-progress: false + +jobs: + # Single deploy job since we're just deploying + deploy: + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Setup Pages + uses: actions/configure-pages@v5 + + - name: Use Node.js 16 + uses: actions/setup-node@v3 + with: + node-version: 16 + cache: 'yarn' + + - id: env + run: echo "repo-name=${GITHUB_REPOSITORY#$GITHUB_REPOSITORY_OWNER/}" >> $GITHUB_OUTPUT + + - run: yarn install --frozen-lockfile + - run: yarn lint + - run: yarn test + - run: yarn build-prod + env: + WEBPACK_PUBLIC_PATH: "/${{ steps.env.outputs.repo-name }}" + + - name: Upload artifact + uses: actions/upload-pages-artifact@v3 + with: + path: 'dist/' + + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v4 diff --git a/src/BrowserApp.tsx b/src/BrowserApp.tsx index 65593f8..c6c358d 100644 --- a/src/BrowserApp.tsx +++ b/src/BrowserApp.tsx @@ -1,9 +1,10 @@ import React from 'react'; import { BrowserRouter } from 'react-router-dom'; import { SchemaApp } from './SchemaApp' +import { getBasename } from './basename' export const App: React.FC = () => ( - + ) \ No newline at end of file diff --git a/src/basename.ts b/src/basename.ts new file mode 100644 index 0000000..663737d --- /dev/null +++ b/src/basename.ts @@ -0,0 +1,4 @@ +export const getBasename = () => { + const pathname = new URL(document.baseURI).pathname; + return pathname.endsWith("/") ? pathname.slice(0, -1) : pathname; + } \ No newline at end of file diff --git a/webpack.common.js b/webpack.common.js index f169a18..4f00f6e 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -35,7 +35,7 @@ module.exports = { new HtmlWebpackPlugin({ title: 'JSON Schema Viewer', template: 'index.html', - publicPath: '/', + publicPath: process.env.WEBPACK_PUBLIC_PATH ?? '/', filename: 'index.html' }), new CspHtmlWebpackPlugin({ @@ -51,7 +51,7 @@ module.exports = { }), new FaviconsWebpackPlugin({ logo: './src/logo.svg', - publicPath: '/', + publicPath: process.env.WEBPACK_PUBLIC_PATH ?? '/', prefix: 'auto/[contenthash]' }) ]