Stage 2: Setup Velite

.gitignore

@@ -34,3 +34,6 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# velite files
+.velite

content/blog/hello-world.mdx

@@ -0,0 +1,10 @@
+---
+title: Hello World
+description: This is our first blog post
+date: 2024-07-17
+published: true
+---
+
+# Hello World
+
+Welcome to my blog

next.config.mjs

@@ -1,4 +1,24 @@
+import { build } from "velite";
+
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+export default {
+  // othor next config here...
+  webpack: (config) => {
+    config.plugins.push(new VeliteWebpackPlugin());
+    return config;
+  },
+};
 
-export default nextConfig;
+class VeliteWebpackPlugin {
+  static started = false;
+  apply(/** @type {import('webpack').Compiler} */ compiler) {
+    // executed three times in nextjs
+    // twice for the server (nodejs / edge runtime) and once for the client
+    compiler.hooks.beforeCompile.tapPromise("VeliteWebpackPlugin", async () => {
+      if (VeliteWebpackPlugin.started) return;
+      VeliteWebpackPlugin.started = true;
+      const dev = compiler.options.mode === "development";
+      await build({ watch: dev, clean: !dev });
+    });
+  }
+}