Add an add-on to document & generate the style guide

lib/nimble_template/addons/variants/phoenix/web/kss.ex

@@ -0,0 +1,64 @@
+defmodule NimbleTemplate.Addons.Phoenix.Web.Kss do
+  @moduledoc false
+
+  use NimbleTemplate.Addon
+
+  @impl true
+  def do_apply(%Project{} = project, _opts) do
+    project
+    |> edit_files()
+    |> copy_files()
+  end
+
+  defp edit_files(%Project{} = project) do
+    project
+    |> edit_package_json()
+    |> edit_endpoint()
+  end
+
+  defp copy_files(%Project{} = project) do
+    Generator.copy_file([{:text, ".kss-config.json", "assets/.kss-config.json"}])
+
+    project
+  end
+
+  defp edit_package_json(%Project{} = project) do
+    Generator.replace_content(
+      "assets/package.json",
+      """
+        "devDependencies": {
+      """,
+      """
+        "devDependencies": {
+          "kss": "^3.0.1",
+      """
+    )
+
+    Generator.replace_content(
+      "assets/package.json",
+      """
+        "scripts": {
+      """,
+      """
+        "scripts": {
+          "styleguide.generate": "kss --config .kss-config.json",
+      """
+    )
+
+    project
+  end
+
+  def edit_endpoint(%Project{otp_app: otp_app} = project) do
+    Generator.replace_content(
+      "lib/#{otp_app}_web/endpoint.ex",
+      """
+        only: ~w(css fonts images js favicon.ico robots.txt)
+      """,
+      """
+        only: ~w(css fonts images styleguide js favicon.ico robots.txt)
+      """
+    )
+
+    project
+  end
+end

lib/nimble_template/variants/phoenix/web/template.ex

@@ -1,10 +1,14 @@
 defmodule NimbleTemplate.Phoenix.Web.Template do
   @moduledoc false
 
+  import NimbleTemplate.AddonHelper
+
   alias NimbleTemplate.Addons.Phoenix.Web
   alias NimbleTemplate.Project
 
   def apply(%Project{} = project) do
+    if install_addon_prompt?("Style guide (KSS)"), do: Web.Kss.apply(project)
+
     project
     |> Web.Assets.apply()
     |> Web.CoreJS.apply()

priv/templates/nimble_template/.kss-config.json

@@ -0,0 +1,25 @@
+{
+  "title": "Living Style Guide",
+
+  "//": "The home page content, in markdown format",
+  "homepage": "styleguide/homepage.md",
+
+  "//": "Source tells KSS where the CSS, Sass, or SCSS is that it should parse for documentation comments.",
+  "//": "The source and destination paths are relative to this file.",
+  "source": "css",
+
+  "//": "Destination tells KSS where to compile the style guide to.",
+  "destination": "../priv/static/styleguide/",
+
+  "//": "CSS gives KSS the path to the CSS files, so it can pull the styles into the style guide.",
+  "//": "The path needs to be relative to the style guide destination.",
+  "css": [
+    "../css/app.css"
+  ],
+
+  "//": "To include any javascript files, add this block, with the path to the javascript file.",
+  "//": "Also relative to the style guide destination.",
+  "js" : [
+    "../js/app.js"
+  ]
+}

test/nimble_template/addons/variants/phoenix/web/kss_test.exs

@@ -0,0 +1,39 @@
+defmodule NimbleTemplate.Addons.Phoenix.Web.KssTest do
+  use NimbleTemplate.AddonCase, async: false
+
+  describe "#apply/2" do
+    test "adds kss and a custom script into package.json", %{
+      project: project,
+      test_project_path: test_project_path
+    } do
+      in_test_project(test_project_path, fn ->
+        AddonsWeb.Kss.apply(project)
+
+        assert_file("assets/package.json", fn file ->
+          assert file =~ """
+                     "kss": "^3.0.1",
+                 """
+
+          assert file =~ """
+                     "styleguide.generate": "kss --config .kss-config.json",
+                 """
+        end)
+      end)
+    end
+
+    test "updates lib/nimble_template_web/endpoint.ex", %{
+      project: project,
+      test_project_path: test_project_path
+    } do
+      in_test_project(test_project_path, fn ->
+        AddonsWeb.Wallaby.apply(project)
+
+        assert_file("lib/nimble_template_web/endpoint.ex", fn file ->
+          assert file =~ """
+                   only: ~w(css fonts images styleguide js favicon.ico robots.txt)
+                 """
+        end)
+      end)
+    end
+  end
+end