feat(presets): new preset vuepress (#412)

lib/presets/vuepress/azion.config.js

@@ -0,0 +1,49 @@
+import { defineConfig } from 'azion';
+
+export default defineConfig({
+  build: {
+    preset: {
+      name: 'vuepress',
+    },
+  },
+  origin: [
+    {
+      name: 'origin-storage-default',
+      type: 'object_storage',
+    },
+  ],
+  rules: {
+    request: [
+      {
+        name: 'Set Storage Origin for All Requests',
+        match: '^\\/',
+        behavior: {
+          setOrigin: {
+            name: 'origin-storage-default',
+            type: 'object_storage',
+          },
+        },
+      },
+      {
+        name: 'Deliver Static Assets',
+        match:
+          '.(css|js|ttf|woff|woff2|pdf|svg|jpg|jpeg|gif|bmp|png|ico|mp4|json|xml|html)$',
+        behavior: {
+          setOrigin: {
+            name: 'origin-storage-default',
+            type: 'object_storage',
+          },
+          deliver: true,
+        },
+      },
+
+      {
+        name: 'Redirect to index.html',
+        match: '^\\/',
+        behavior: {
+          rewrite: `/index.html`,
+        },
+      },
+    ],
+  },
+});

lib/presets/vuepress/config.js

@@ -0,0 +1,10 @@
+/**
+ * Config to be used in build context.
+ */
+const config = {
+  builder: 'webpack',
+  polyfills: false,
+  custom: {},
+};
+
+export default config;

lib/presets/vuepress/handler.js

@@ -0,0 +1,17 @@
+import { mountMPA } from 'azion/utils';
+
+/**
+ * Handles the 'fetch' event.
+ * @param {import('azion/types').FetchEvent} event - The fetch event.
+ * @returns {Promise<Response>} The response for the request.
+ */
+async function handler(event) {
+  try {
+    const myApp = await mountMPA(event.request.url);
+    return myApp;
+  } catch (e) {
+    return new Response('Not Found', { status: 404 });
+  }
+}
+
+export default handler;

lib/presets/vuepress/prebuild.js

@@ -0,0 +1,39 @@
+import { lstat, rm } from 'fs/promises';
+import { exec, getPackageManager, copyDirectory } from '#utils';
+
+const packageManager = await getPackageManager();
+
+/**
+ * Check if the project uses the "/docs"
+ * @returns {boolean} True if the structure is being used, false otherwise.
+ */
+async function docsFolderExists() {
+  try {
+    await lstat('docs/');
+    return true;
+  } catch (err) {
+    return false;
+  }
+}
+
+/**
+ * Runs custom prebuild actions
+ */
+async function prebuild() {
+  const newOutDir = '.edge/storage';
+
+  // The main folder for VuePress usually is 'docs',
+  // however the users also might use the root folder
+  const outDir = (await docsFolderExists())
+    ? 'docs/.vuepress/dist'
+    : '.vuepress/dist';
+
+  await exec(`${packageManager} run docs:build`, 'Vuepress', true);
+
+  // move files to vulcan default path
+  copyDirectory(outDir, newOutDir);
+
+  rm(outDir, { recursive: true, force: true });
+}
+
+export default prebuild;

lib/utils/presets/presets.utils.test.js

@@ -28,6 +28,7 @@ describe('getPresetsList utils', () => {
       'typescript',
       'vitepress',
       'vue',
+      'vuepress',
     ];
 
     const result = presets.getKeys();

tests/e2e/vuepress-static.test.js

@@ -0,0 +1,50 @@
+import puppeteer from 'puppeteer';
+import projectInitializer from '../utils/project-initializer.js';
+import projectStop from '../utils/project-stop.js';
+import { getContainerPort } from '../utils/docker-env-actions.js';
+
+// timeout in minutes
+const TIMEOUT = 10 * 60 * 1000;
+
+let serverPort;
+let localhostBaseUrl;
+const EXAMPLE_PATH = '/examples/vuepress-static';
+
+describe('E2E - vuepress project', () => {
+  let browser;
+  let page;
+
+  beforeAll(async () => {
+    serverPort = getContainerPort();
+    localhostBaseUrl = `http://0.0.0.0:${serverPort}`;
+
+    await projectInitializer(EXAMPLE_PATH, 'vuepress  ', serverPort);
+
+    browser = await puppeteer.launch({ headless: 'new' });
+    page = await browser.newPage();
+  }, TIMEOUT);
+
+  afterAll(async () => {
+    await projectStop(serverPort, EXAMPLE_PATH.replace('/examples/', ''));
+
+    await browser.close();
+  }, TIMEOUT);
+
+  test('Should render home page in "/" route', async () => {
+    await page.goto(`${localhostBaseUrl}/`);
+
+    const pageContent = await page.content();
+    const pageTitle = await page.title();
+
+    expect(pageContent).toContain('A VuePress project');
+    expect(pageTitle).toContain('VuePress Boilerplate');
+  });
+
+  test('Should render edge page in "/get-started.html" route', async () => {
+    await page.goto(`${localhostBaseUrl}/get-started.html`);
+
+    const pageContent = await page.content();
+
+    expect(pageContent).toContain('Get Started');
+  });
+});