Enable JSON module resolution in TypeScript configuration and update BlogLayout to display version from package.json

src/components/BlogLayout.tsx

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 import { BlogHeader } from './BlogHeader';
+import packageJson from '../../package.json';
 
 interface BlogLayoutProps {
   children: ReactNode;
@@ -16,17 +17,7 @@ export function BlogLayout({ children }: BlogLayoutProps) {
         <div className="container px-4 sm:px-6 lg:px-8">
           <div className="flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-muted-foreground">
             <p>Powered by Nostr</p>
-            {/* <p>
-              Vibed with{' '}
-              <a
-                href="https://soapbox.pub/mkstack"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="underline hover:text-foreground transition-colors"
-              >
-                MKStack
-              </a>
-            </p> */}
+            <p>Version {packageJson.version}</p>
           </div>
         </div>
       </footer>

tsconfig.json

@@ -9,6 +9,7 @@
     /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
     "isolatedModules": true,
     "moduleDetection": "force",
     "noEmit": true,