Skip to content

Instantly share code, notes, and snippets.

@kovasap
Created April 21, 2024 17:52
Show Gist options
  • Save kovasap/d4706d2e46ecb7eece2ba15311aec08b to your computer and use it in GitHub Desktop.
Save kovasap/d4706d2e46ecb7eece2ba15311aec08b to your computer and use it in GitHub Desktop.
Inline css and js in html code
<!DOCTYPE html>
<html lang="en-us">
<head>
<title>Full Stack Clojure</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Note that the slashes in front of each filename are necessary for the script to find them!! -->
<link rel="stylesheet" href="/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="/css/bulma.min.css">
<link rel="stylesheet" href="/css/custom.css">
</head>
<body>
<div id="app"></div>
<!-- Note that the slashes in front of each filename are necessary for the script to find them!! -->
<script src="/js/compiled/base.js"></script>
</body>
</html>
#!/usr/bin/env bb
(require '[clojure.java.io]
'[clojure.string :as st]
'[clojure.java.shell :refer [sh]]
'[clojure.tools.cli :refer [parse-opts]])
(def dir-prefix "resources/public/")
(def html-filename "index.html")
(def output-filename "output.html")
(defn relative-slurp
[filename]
(slurp (str dir-prefix filename)))
(defn find-inlinable-files [html-content]
(mapcat #(map last (re-seq % html-content)) [#"href=\"/(.*?)\""
#"src=\"/(.*?)\""]))
(defn find-html-to-replace [html-content file-to-inline]
(re-find (re-pattern (str "<.*" file-to-inline ".*>")) html-content))
(defn clean-js
[js-code]
(st/replace js-code "</script>" "</scr\" + \"ipt>"))
(defn is-css?
[filename]
(st/includes? filename ".css"))
(defn is-js?
[filename]
(st/includes? filename ".js"))
(defn get-replacement-content
[file-to-inline]
(cond (is-css? file-to-inline) (str "<style>"
(relative-slurp file-to-inline)
"</style>")
(is-js? file-to-inline) (str "<script>"
(clean-js (relative-slurp
file-to-inline))
"</script>")
:else (slurp file-to-inline)))
(defn inline-files
[]
(let [html-content (relative-slurp html-filename)]
#_(doseq [file (find-inlinable-files html-content)]
(prn file)
(prn (find-html-to-replace html-content file)))
(spit output-filename
((apply comp
(for [file-to-inline (find-inlinable-files html-content)]
(fn [cur-html-content]
(st/replace cur-html-content
(find-html-to-replace html-content file-to-inline)
(get-replacement-content file-to-inline)))))
html-content))))
(inline-files)
@kovasap
Copy link
Author

kovasap commented Apr 21, 2024

Works well for my shadow-cljs project. Can be run on the command line like bb inline.clj using https://babashka.org/.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment