try again to fix asset paths in distribution

Author: Ibrahim-Haizel

package-lock.json

@@ -15,14 +15,15 @@
     "dev": "vite dev",
     "build": "vite build && npm run package",
     "preview": "vite preview",
-    "prepackage": "tsx scripts/generate-index.ts",
+    "prepackage": "tsx scripts/generate-index.ts && node scripts/copy-static-assets.js && npm run copy-govuk-assets",
     "package": "npm run prepackage && svelte-kit sync && svelte-package && publint",
     "prepublishOnly": "npm run package",
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
     "lint": "eslint . && prettier --check .",
     "format": "prettier --write .",
     "generate-data": "tsx scripts/generateJSONData.cjs",
+    "copy-static-assets": "node scripts/copy-static-assets.js",
     "copy-govuk-assets": "node scripts/copy-govuk-assets.js",
     "prepare": "npm run copy-govuk-assets",
     "create-component-and-wrapper-pages": "node scripts/create-component-and-wrapper-pages.js"
@@ -77,8 +78,7 @@
     "tsx": "^4.19.2",
     "typescript": "^5.0.0",
     "typescript-eslint": "^8.0.0",
-    "vite": "^5.0.11",
-    "vite-plugin-static-copy": "^2.3.1"
+    "vite": "^5.0.11"
   },
   "dependencies": {
     "@dwp/dwp-frontend": "^3.3.0",

package.json

@@ -10,14 +10,15 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 const projectRoot = join(__dirname, "..");
 
-// Add components directory
+// Add components directory and new static assets directory
 const dirs = [
   join(projectRoot, "static/assets"),
   join(projectRoot, "static/assets/images"),
   join(projectRoot, "static/assets/fonts"),
   join(projectRoot, "static/css"),
   join(projectRoot, "static/js"),
   join(projectRoot, "src/lib/components/js/components"),
+  join(projectRoot, "src/lib/static/assets/css"), // Add new CSS destination
 ];
 
 dirs.forEach((dir) => {
@@ -71,7 +72,7 @@ const govukCssDestStatic = join(
 );
 const govukCssDestLib = join(
   projectRoot,
-  "src/lib/styles/vendor/govuk-frontend.min.css",
+  "src/lib/static/assets/css/govuk-frontend.min.css",
 );
 
 if (fs.existsSync(govukCssSrc)) {
@@ -93,7 +94,7 @@ const mojCssSrc = join(mojPath, "moj/moj-frontend.min.css");
 const mojCssDestStatic = join(projectRoot, "static/css/moj-frontend.min.css");
 const mojCssDestLib = join(
   projectRoot,
-  "src/lib/styles/vendor/moj-frontend.min.css",
+  "src/lib/static/assets/css/moj-frontend.min.css",
 );
 
 if (fs.existsSync(mojCssSrc)) {

scripts/copy-govuk-assets.js

@@ -0,0 +1,33 @@
+import fs from "fs-extra";
+import { join } from "node:path";
+
+const projectRoot = join(process.cwd()); // Assumes script run from project root
+
+const staticDir = join(projectRoot, "static/assets");
+const libDestDir = join(projectRoot, "src/lib/static/assets");
+
+const assetsToCopy = ["fonts", "images", "govuk_publishing_components"];
+
+console.log("Copying static assets to src/lib/static/assets...");
+
+// Ensure the base destination directory exists
+fs.ensureDirSync(libDestDir);
+console.log(`Ensured directory exists: ${libDestDir}`);
+
+assetsToCopy.forEach((assetType) => {
+  const sourcePath = join(staticDir, assetType);
+  const destPath = join(libDestDir, assetType);
+
+  if (fs.existsSync(sourcePath)) {
+    try {
+      fs.copySync(sourcePath, destPath, { overwrite: true });
+      console.log(`Copied ${sourcePath} to ${destPath}`);
+    } catch (err) {
+      console.error(`Error copying ${assetType}:`, err);
+    }
+  } else {
+    console.warn(`Source directory not found, skipping: ${sourcePath}`);
+  }
+});
+
+console.log("Static assets copy process completed!");

scripts/copy-static-assets.js

@@ -1,2 +1,2 @@
-@import "./styles/vendor/moj-frontend.min.css";
-@import "./styles/vendor/govuk-frontend.min.css";
+@import "./static/assets/css/moj-frontend.min.css";
+@import "./static/assets/css/govuk-frontend.min.css";

src/lib/components_base.css

@@ -1,5 +1,5 @@
 // this file is auto-generated — do not edit by hand
-import "$lib/app.css";
+import "$lib/components_base.css";
 
 export { default as InsetText } from './components/content/InsetText.svelte';
 export { default as WarningText } from './components/content/WarningText.svelte';