Add ./build.sh watch to integrate all continuous builds. (#390)

All continuous builds are now servicable through `dotnet watch`

> dotnet watch --project src/docs-builder --no-hot-reload -- serve

Will build web assets without recompiling c# or rebooting the server.

C# or cshtml changes will rebuild automatically.

Markdown files will continue to be server through liverload without a full restart.

Co-authored-by: Jan Calanog <[email protected]>

Author: Mpdreamz

README.md

@@ -144,18 +144,22 @@ existing surveyed tools
 - [.NET 9.0 SDK](https://dotnet.microsoft.com/en-us/download/dotnet/9.0)
 - [Node.js 22.13.1 (LTS)](https://nodejs.org/en/blog/release/v22.13.1)
 
-## Live Reload Markdown files in the `docs` folder:
-```shell
-dotnet run --project src/docs-builder -- serve
-```
 
-## Automatically rebuild changes to `src/Elastic.Markdown/Assets` JS and CSS files:
+## Continuously build all assets during development.
+
 ```shell
-cd src/Elastic.Markdown
-npm ci
-npm run watch
+./build.sh watch
 ```
 
+This will monitor code, cshtml template files & static files and reload the application
+if any changes.
+
+Web assets are reloaded through `parcel watch` and don't require a recompilation.
+
+Markdown files are refreshed automatically through livereload
+
+Code or layout changes will relaunch the server automatically
+
 # Release Process
 
 This section outlines the process for releasing a new version of this project.

build/CommandLine.fs

@@ -17,7 +17,8 @@ type Build =
     | [<CliPrefix(CliPrefix.None);SubCommand>] Test
 
     | [<CliPrefix(CliPrefix.None);SubCommand>] Format
-    
+    | [<CliPrefix(CliPrefix.None);SubCommand>] Watch
+
     | [<CliPrefix(CliPrefix.None);Hidden;SubCommand>] Lint
     | [<CliPrefix(CliPrefix.None);Hidden;SubCommand>] PristineCheck
     | [<CliPrefix(CliPrefix.None);Hidden;SubCommand>] ValidateLicenses
@@ -46,7 +47,9 @@ with
             | Release -> "runs build, tests, and create and validates the packages shy of publishing them"
             | Publish -> "Publishes artifacts"
             | Format -> "runs dotnet format"
-            
+
+            | Watch -> "runs dotnet watch to continuous build code/templates and web assets on the fly"
+
             // steps
             | Lint
             | PristineCheck

build/Targets.fs

@@ -35,6 +35,8 @@ let private version _ =
 
 let private format _ = exec { run "dotnet" "format" "--verbosity" "quiet" }
 
+let private watch _ = exec { run "dotnet" "watch" "--project" "src/docs-builder" "--no-hot-reload" "--" "serve" }
+
 let private lint _ =
     match exec {
         exit_code_of "dotnet" "format" "--verify-no-changes"
@@ -167,6 +169,7 @@ let Setup (parsed:ParseResults<Build>) =
                 release
 
         | Format -> Build.Step format
+        | Watch -> Build.Step watch
 
         // steps
         | Lint -> Build.Step lint

src/Elastic.Markdown/Assets/styles.css

@@ -5,4 +5,4 @@
 @import "legacy/togglebutton.css";
 @import "legacy/sphinx-design.min.css";
 @import "legacy/custom.css";
-@import "legacy/atom-one-light.css";
+@import "legacy/atom-one-light.css";

src/Elastic.Markdown/Elastic.Markdown.csproj

@@ -22,7 +22,7 @@
     Documentation: https://learn.microsoft.com/en-us/visualstudio/msbuild/incremental-builds?WT.mc_id=DT-MVP-5003978
  -->
   <Target Name="NpmInstall" Inputs="package.json" Outputs="node_modules/.install-stamp">
-    <Exec Command="npm ci" />
+    <Exec Command="npm ci" WorkingDirectory="$(MSBuildThisFileDirectory)" ConsoleToMsBuild="true" />
 
     <!-- Write the stamp file, so incremental builds work -->
     <Touch Files="node_modules/.install-stamp" AlwaysCreate="true" />
@@ -33,15 +33,17 @@
       MSBuild runs NpmInstall before this task because of the DependsOnTargets attribute.
    -->
   <Target Name="NpmRunBuild" DependsOnTargets="NpmInstall" BeforeTargets="BeforeBuild">
-    <Exec Command="npm run build" />
+    <Exec Command="npm run build" WorkingDirectory="$(MSBuildThisFileDirectory)" ConsoleToMsBuild="true">
+      <Output TaskParameter="ConsoleOutput" PropertyName="OutputOfExec" />
+    </Exec>
   </Target>
 
   <Target Name="EmbedGeneratedAssets" AfterTargets="NpmRunBuild">
     <ItemGroup>
-      <EmbeddedResource Include="_static/*.js.map" />
-      <EmbeddedResource Include="_static/*.js" />
-      <EmbeddedResource Include="_static/*.css" />
-      <EmbeddedResource Include="_static/*.css.map" />
+      <EmbeddedResource Include="_static/*.js" Watch="false" />
+      <EmbeddedResource Include="_static/*.js.map" Watch="false" />
+      <EmbeddedResource Include="_static/*.css" Watch="false" />
+      <EmbeddedResource Include="_static/*.css.map" Watch="false" />
       <EmbeddedResource Include="_static/*.svg" />
     </ItemGroup>
   </Target>
@@ -58,4 +60,5 @@
     <PackageReference Include="YamlDotNet" Version="16.1.3" />
     <PackageReference Include="System.IO.Abstractions" Version="21.0.29" />
   </ItemGroup>
+
 </Project>

src/docs-builder/Http/DocumentationWebHost.cs

@@ -3,6 +3,7 @@
 // See the LICENSE file in the project root for more information
 using System.Diagnostics.CodeAnalysis;
 using System.IO.Abstractions;
+using System.Reflection;
 using Documentation.Builder.Diagnostics;
 using Documentation.Builder.Diagnostics.Console;
 using Documentation.Builder.Diagnostics.LiveMode;
@@ -28,9 +29,11 @@ public class DocumentationWebHost
 	private readonly WebApplication _webApplication;
 
 	private readonly BuildContext _context;
+	private readonly ILogger<DocumentationWebHost> _logger;
 
 	public DocumentationWebHost(string? path, int port, ILoggerFactory logger, IFileSystem fileSystem)
 	{
+		_logger = logger.CreateLogger<DocumentationWebHost>();
 		var builder = WebApplication.CreateSlimBuilder();
 
 		builder.Logging.ClearProviders();
@@ -52,15 +55,17 @@ public DocumentationWebHost(string? path, int port, ILoggerFactory logger, IFile
 		});
 		builder.Services.AddSingleton<ReloadableGeneratorState>(_ => new ReloadableGeneratorState(_context.SourcePath, null, _context, logger));
 		builder.Services.AddHostedService<ReloadGeneratorService>();
-
-		//builder.Services.AddSingleton(logger);
+		if (IsDotNetWatchBuild())
+			builder.Services.AddHostedService<ParcelWatchService>();
 
 		builder.WebHost.UseUrls($"http://localhost:{port}");
 
 		_webApplication = builder.Build();
 		SetUpRoutes();
 	}
 
+	private bool IsDotNetWatchBuild() =>
+		Environment.GetEnvironmentVariable("DOTNET_WATCH") is not null;
 
 	public async Task RunAsync(Cancel ctx)
 	{

src/docs-builder/Http/ParcelWatchService.cs

@@ -0,0 +1,44 @@
+// Licensed to Elasticsearch B.V under one or more agreements.
+// Elasticsearch B.V licenses this file to you under the Apache 2.0 License.
+// See the LICENSE file in the project root for more information
+
+using System.Diagnostics;
+using Elastic.Markdown.IO;
+using Microsoft.Extensions.Hosting;
+
+namespace Documentation.Builder.Http;
+
+public class ParcelWatchService : IHostedService
+{
+	private Process? _process;
+
+	public Task StartAsync(CancellationToken cancellationToken)
+	{
+		_process = Process.Start(new ProcessStartInfo
+		{
+			FileName = "npm",
+			Arguments = "run watch",
+			RedirectStandardOutput = true,
+			RedirectStandardError = true,
+			UseShellExecute = false,
+			CreateNoWindow = true,
+			WorkingDirectory = Path.Combine(Paths.Root.FullName, "src", "Elastic.Markdown")
+		})!;
+
+		_process.EnableRaisingEvents = true;
+		_process.OutputDataReceived += (_, e) => Console.WriteLine($"[npm run watch]: {e.Data}");
+		_process.ErrorDataReceived += (_, e) => Console.WriteLine($"[npm run watch]: {e.Data}");
+
+		_process.BeginOutputReadLine();
+		_process.BeginErrorReadLine();
+
+		return Task.CompletedTask;
+	}
+
+	public Task StopAsync(CancellationToken cancellationToken)
+	{
+		_process?.Kill(entireProcessTree: true);
+		_process?.Kill();
+		return Task.CompletedTask;
+	}
+}