Website: Add .htaccess file

Adds a .htaccess file to playground.wordpress.net that does the following:

1. Prevents caching of the main index.html file. Otherwise the browser may
   try to load outdated JavaScript, CSS, and WASM assets and and up in a
   broken state.
2. Adds the Access-Control-Allow-Origin header for the blueprint-schema.json
   file and the hosted client.js library to enable `import()`-ing both.

 ## Testing instructions

None. I tested this in an Apache setup, then manually updated the production
.htaccess file, and it all worked as expected.

Related to #855
Closes #873

Author: adamziel

packages/playground/website/.htaccess

@@ -0,0 +1,7 @@
+<FilesMatch "index\.html">
+Header unset ETag
+Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
+</FilesMatch>
+<FilesMatch "(client\/|blueprint-schema\.json)">
+Header set Access-Control-Allow-Origin "*"
+</FilesMatch>

packages/playground/website/project.json

@@ -19,7 +19,7 @@
 					"cp -r ./client ./wasm-wordpress-net/",
 					"cp -r ./remote/* ./wasm-wordpress-net/",
 					"cp -r ./website/* ./wasm-wordpress-net/",
-					"cat ./remote/.htaccess > ./wasm-wordpress-net/.htaccess"
+					"cat ./remote/.htaccess ./website/.htaccess > ./wasm-wordpress-net/.htaccess"
 				],
 				"cwd": "dist/packages/playground",
 				"parallel": false

packages/playground/website/vite.config.ts

@@ -1,6 +1,6 @@
 /// <reference types="vitest" />
 import { defineConfig } from 'vite';
-import type { ViteDevServer } from 'vite';
+import type { Plugin, ViteDevServer } from 'vite';
 import react from '@vitejs/plugin-react';
 import { execSync } from 'node:child_process';
 // eslint-disable-next-line @nx/enforce-module-boundaries
@@ -18,6 +18,8 @@ import {
 import virtualModule from '../vite-virtual-module';
 import { oAuthMiddleware } from './vite.oauth';
 import { fileURLToPath } from 'node:url';
+import { copyFileSync, existsSync } from 'node:fs';
+import { join } from 'node:path';
 
 const proxy = {
 	'^/plugin-proxy': {
@@ -34,6 +36,7 @@ try {
 	buildVersion = (new Date().getTime() / 1000).toFixed(0);
 }
 
+const path = (filename: string) => new URL(filename, import.meta.url).pathname;
 export default defineConfig(({ command, mode }) => {
 	return {
 		// Split traffic from this server on dev so that the iframe content and outer
@@ -92,6 +95,23 @@ export default defineConfig(({ command, mode }) => {
 					server.middlewares.use(oAuthMiddleware);
 				},
 			},
+			/**
+			 * Copy the `.htaccess` file to the `dist` directory.
+			 */
+			{
+				name: 'htaccess-plugin',
+				apply: 'build',
+				writeBundle({ dir: outputDir }) {
+					const htaccessPath = path('.htaccess');
+
+					if (existsSync(htaccessPath) && outputDir) {
+						copyFileSync(
+							htaccessPath,
+							join(outputDir, '.htaccess')
+						);
+					}
+				},
+			} as Plugin,
 		],
 
 		// Configuration for building your library.