fix building for PWA

.github/workflows/deploying.yml

@@ -6,6 +6,36 @@ on:
       - master
 
 jobs:
+  build_pwa:
+    name: Build PWA
+    runs-on: ubuntu-latest
+    
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v3
+                  
+    - uses: pnpm/action-setup@v2
+      with:
+        version: 8
+        
+    - name: Install Node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: 18
+        cache: 'pnpm'
+    
+    - name: Install pnpm packages
+      run: pnpm install
+    
+    - name: Build project
+      run: pnpm run build:pwa
+
+    - name: Upload production-ready build files
+      uses: actions/upload-artifact@v3
+      with:
+        name: pwa
+        path: ./dist
+
   build:
     name: Build
     runs-on: ubuntu-latest
@@ -14,6 +44,10 @@ jobs:
     - name: Checkout code
       uses: actions/checkout@v3
                   
+    - uses: pnpm/action-setup@v2
+      with:
+        version: 8
+    
     - name: Install Node.js
       uses: actions/setup-node@v3
       with:
@@ -29,26 +63,35 @@ jobs:
     - name: Upload production-ready build files
       uses: actions/upload-artifact@v3
       with:
-        name: production-files
+        name: normal
         path: ./dist
 
   release:
     name: Release
-    needs: build
+    needs: [build, build_pwa]
     runs-on: ubuntu-latest
 
     steps:
     - name: Checkout code
       uses: actions/checkout@v3
 
-    - name: Download artifact
+    - name: Download PWA artifact
       uses: actions/download-artifact@v3
       with:
-        name: production-files
-        path: ./dist
+        name: pwa
+        path: ./dist_pwa
 
-    - name: Zip files
-      run: cd dist && zip -r ../movie-web.zip .
+    - name: Zip PWA files
+      run: cd dist_pwa && zip -r ../movie-web.pwa.zip .
+
+    - name: Download normal artifact
+      uses: actions/download-artifact@v3
+      with:
+        name: normal
+        path: ./dist_normal
+
+    - name: Zip normal files
+      run: cd dist_normal && zip -r ../movie-web.zip .
 
     - name: Get version
       id: package-version
@@ -65,7 +108,18 @@ jobs:
         draft: false
         prerelease: false
 
-    - name: Upload Release Asset
+    - name: Upload release (PWA)
+      id: upload-release-asset
+      uses: actions/upload-release-asset@v1
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      with:
+        upload_url: ${{ steps.create_release.outputs.upload_url }}
+        asset_path: ./movie-web.pwa.zip
+        asset_name: movie-web.pwa.zip
+        asset_content_type: application/zip
+
+    - name: Upload Release (Normal)
       id: upload-release-asset
       uses: actions/upload-release-asset@v1
       env:

.github/workflows/docs.yml

@@ -14,6 +14,10 @@ jobs:
     - name: Checkout code
       uses: actions/checkout@v3
               
+    - uses: pnpm/action-setup@v2
+      with:
+        version: 8
+
     - name: Install Node.js
       uses: actions/setup-node@v3
       with:

.github/workflows/linting_testing.yml

@@ -16,6 +16,10 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@v3
             
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
       - name: Install Node.js
         uses: actions/setup-node@v3
         with:
@@ -36,6 +40,10 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@v3
       
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
       - name: Install Node.js
         uses: actions/setup-node@v3
         with:

.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

package.json

@@ -35,6 +35,7 @@
   "scripts": {
     "dev": "vite",
     "build": "vite build",
+    "build:pwa": "cross-env VITE_PWA_ENABLED=yes vite build",
     "test": "vitest run",
     "preview": "vite preview",
     "lint": "eslint --ext .tsx,.ts src",
@@ -75,6 +76,7 @@
     "@typescript-eslint/parser": "^5.13.0",
     "@vitejs/plugin-react": "^3.1.0",
     "autoprefixer": "^10.4.13",
+    "cross-env": "^7.0.3",
     "eslint": "^8.10.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "^8.6.0",

pnpm-lock.yaml

@@ -151,6 +151,9 @@ devDependencies:
   autoprefixer:
     specifier: ^10.4.13
     version: 10.4.15(postcss@8.4.29)
+  cross-env:
+    specifier: ^7.0.3
+    version: 7.0.3
   eslint:
     specifier: ^8.10.0
     version: 8.48.0
@@ -2840,6 +2843,14 @@ packages:
     requiresBuild: true
     dev: false
 
+  /cross-env@7.0.3:
+    resolution: {integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==}
+    engines: {node: '>=10.14', npm: '>=6', yarn: '>=1'}
+    hasBin: true
+    dependencies:
+      cross-spawn: 7.0.3
+    dev: true
+
   /cross-fetch@3.1.8:
     resolution: {integrity: sha512-cvA+JwZoU0Xq+h6WkMvAUqPEYy92Obet6UdKLfW60qn99ftItKjB5T+BkyWOFWe2pUyfQ+IJHmpOTznqk1M6Kg==}
     dependencies:

public/_headers

@@ -3,3 +3,11 @@
   X-XSS-Protection: 1; mode=block
   X-Content-Type-Options: nosniff
   Referrer-Policy: origin-when-cross-origin
+  Cache-Control: public, max-age=0, s-maxage=0, must-revalidate
+
+/manifest.webmanifest
+  Content-Type: application/manifest+json
+
+# assets get a long cache instead of no cache
+/assets/*
+  Cache-Control: public, max-age=31536000, s-maxage=31536000, immutable

public/_redirects

@@ -1 +1,2 @@
+/assets/* /assets/:splat 200
 /* /index.html 200