@knowcode/doc-builder 1.1.6 → 1.1.8

package/CHANGELOG.md

@@ -5,6 +5,31 @@ All notable changes to @knowcode/doc-builder will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.1.8] - 2025-07-19
+
+### Changed
+- Deploy command now always builds documentation first
+- Removed `--no-build` option to ensure fresh builds before deployment
+- Simplified deployment workflow - `deploy` now automatically includes build step
+
+### Improved
+- Guaranteed that deployed documentation is always up-to-date
+- Eliminated confusion about when to build vs when to deploy
+- Streamlined user experience with single deploy command
+
+## [1.1.7] - 2025-07-19
+
+### Fixed
+- Fixed CSS and JS assets not loading on deployed Vercel sites
+- Changed all asset paths from relative to absolute URLs (/css/, /js/)
+- Fixed missing styling on deployed documentation
+- Corrected asset path resolution for Vercel's static hosting
+
+### Changed
+- All HTML templates now use absolute paths for CSS and JS files
+- Logo links now use absolute paths for consistent navigation
+- Index.html generation uses absolute asset paths
+
 ## [1.1.6] - 2025-01-19
 
 ### Fixed

package/cli.js

@@ -124,13 +124,11 @@ program
   .description('Deploy documentation to Vercel production (requires Vercel CLI)')
   .option('-c, --config <path>', 'path to config file (default: doc-builder.config.js)')
   .option('--no-prod', 'deploy as preview instead of production')
-  .option('--no-build', 'skip building before deployment')
   .option('--force', 'force deployment without confirmation')
   .addHelpText('after', `
 ${chalk.yellow('Examples:')}
   ${chalk.gray('$')} doc-builder deploy                 ${chalk.gray('# Deploy to production')}
   ${chalk.gray('$')} doc-builder deploy --no-prod       ${chalk.gray('# Deploy preview only')}
-  ${chalk.gray('$')} doc-builder deploy --no-build      ${chalk.gray('# Deploy existing build')}
 
 ${chalk.yellow('First-time Vercel Setup:')}
   
@@ -269,14 +267,11 @@ ${chalk.yellow('Troubleshooting:')}
         process.exit(1);
       }
       
-      // Check if we need to build first
-      const outputPath = path.join(process.cwd(), config.outputDir || 'html');
-      if (!fs.existsSync(outputPath) || !options.noBuild) {
-        spinner.stop();
-        console.log(chalk.blue('\n📦 Building documentation first...\n'));
-        await build(config);
-        spinner.start('Deploying to Vercel...');
-      }
+      // Always build first
+      spinner.stop();
+      console.log(chalk.blue('\n📦 Building documentation first...\n'));
+      await build(config);
+      spinner.start('Deploying to Vercel...');
       
       // Prepare deployment files
       await prepareDeployment(config);

package/lib/core-builder.js

@@ -82,7 +82,8 @@ function generateHTML(title, content, navigation, currentPath = '', config = {})
     <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
     
     <!-- Styles -->
-    <link rel="stylesheet" href="${relativePath}css/notion-style.css">
+    <link rel="stylesheet" href="/css/notion-style.css">
+    <link rel="stylesheet" href="/css/style.css">
     
     <!-- Favicon -->
     <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📚</text></svg>">
@@ -91,7 +92,7 @@ function generateHTML(title, content, navigation, currentPath = '', config = {})
     <!-- Header -->
     <header class="header">
         <div class="header-content">
-            <a href="${relativePath}index.html" class="logo">${siteName}</a>
+            <a href="/index.html" class="logo">${siteName}</a>
             
             <div class="header-actions">
                 <div class="deployment-info">
@@ -138,8 +139,8 @@ function generateHTML(title, content, navigation, currentPath = '', config = {})
     </div>
     
     <!-- Scripts -->
-    <script src="${relativePath}js/main.js"></script>
-    ${config.features?.authentication ? `<script src="${relativePath}js/auth.js"></script>` : ''}
+    <script src="/js/main.js"></script>
+    ${config.features?.authentication ? `<script src="/js/auth.js"></script>` : ''}
 </body>
 </html>`;
 }

package/lib/deploy.js

@@ -186,6 +186,17 @@ async function deployToVercel(config, isProd = false) {
     throw new Error(`Output directory ${outputPath} does not exist. Run 'doc-builder build' first.`);
   }
   
+  // Check if CSS files exist
+  const cssPath = path.join(outputPath, 'css', 'style.css');
+  if (!fs.existsSync(cssPath)) {
+    console.log(chalk.yellow('\n⚠️  Warning: CSS files not found in output directory!'));
+    console.log(chalk.yellow('   Your documentation may appear without styling.'));
+    console.log(chalk.cyan('\n💡 To fix this:'));
+    console.log(chalk.white('   1. Update to latest version: ') + chalk.gray('npm update @knowcode/doc-builder'));
+    console.log(chalk.white('   2. Rebuild your docs: ') + chalk.gray('npx @knowcode/doc-builder build'));
+    console.log(chalk.white('   3. Then deploy again: ') + chalk.gray('npx @knowcode/doc-builder deploy\n'));
+  }
+  
   // Simple deployment message
   console.log(chalk.blue('\n🚀 Starting deployment to Vercel...'));
   console.log(chalk.gray('This will take a few seconds...\n'));
@@ -343,7 +354,7 @@ async function prepareDeployment(config) {
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="refresh" content="0; url=README.html">
   <title>Redirecting...</title>
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="/css/style.css">
 </head>
 <body>
   <div style="text-align: center; margin-top: 50px;">
@@ -367,8 +378,8 @@ async function prepareDeployment(config) {
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Documentation</title>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
-  <link rel="stylesheet" href="css/style.css">
-  <link rel="stylesheet" href="css/notion-style.css">
+  <link rel="stylesheet" href="/css/style.css">
+  <link rel="stylesheet" href="/css/notion-style.css">
 </head>
 <body>
   <div class="navigation">
@@ -407,7 +418,7 @@ async function prepareDeployment(config) {
       </div>
     </div>
   </div>
-  <script src="js/main.js"></script>
+  <script src="/js/main.js"></script>
   <style>
     .doc-card:hover {
       box-shadow: 0 4px 12px rgba(0,0,0,0.1);
@@ -418,6 +429,7 @@ async function prepareDeployment(config) {
 </html>`;
         fs.writeFileSync(indexPath, indexHtml);
         console.log(chalk.green('✅ Created index.html with file listing'));
+        console.log(chalk.yellow('📌 Remember to rebuild before deploying to see styling!'));
       }
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knowcode/doc-builder",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "description": "Reusable documentation builder for markdown-based sites with Vercel deployment support",
   "main": "index.js",
   "bin": {