PreTeXtBook · siefkenj · Oct 24, 2023
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+dist
+.vscode
+node_modules
diff --git a/bundler/README.md b/bundler/README.md
@@ -0,0 +1,51 @@
+# CSS Bundling
+
+To get started, ensure you have a recent version of Nodejs (>= 18) installed run
+
+```
+npm install
+```
+
+from the `bundler/` directory (this directory).
+
+Then run
+
+```
+npx vite build
+```
+
+to test your installation. If all worked well, you should have a `dist/default` directory that contains bundled CSS in a subdirectory.
+
+## Usage
+
+Environmental variables control what options `vite` uses to package the CSS.
+
+-   `PTX_VERSION` a string that will be used to set the subdirectory into which bundled assets are written (defaults to `version` in `package.json`)
+-   `PTX_MINIFY` a string `true` or `false` indicating whether to minify the CSS after it is bundled.
+-   `PTX_STYLE` a string corresponding to the name of a subdirectory of `src` indicating which CSS to bundle. For example `PTX_STYLE=prism` will bundle the CSS for prismjs into `dist/prism`.
+
+### Example
+
+To create a version 1.7 minified bundle of `oscarlevin`, run
+
+```
+PTX_VERSION=1.7 PTX_MINIFY=true PTX_STYLE=oscarlevin npx vite build
+```
+
+In `dist/oscarlevin/1.7/styles` should now be the bundled CSS, along with any other required assets (e.g., fonts).
+
+### Notes
+
+The bundler by default will create an `index.html` and `index.js` file. These files are a byproduct of the build process and can be ignored.
+
+## Development
+
+Each directory in `src/` contains a different build target. The `index.ts` file contains a list of import statements for the CSS that will
+be bundled. If you want to extend an existing bundle, you may import the existing bundle with `import "../<bundle name>";` (no circular references, please!).
+
+To create a new target, copy an existing target and modify its `index.ts`. You can then set `PTX_STYLE=<new target name>` to build the new target.
+
+### Notes
+
+Some assets are imported from `"../node_modules/..."`. These assets have been installed via the `npm install` command. If you find
+additional assets that are needed, you can run `npm install <asset name>`.
diff --git a/bundler/package-lock.json b/bundler/package-lock.json
diff --git a/bundler/package.json b/bundler/package.json
@@ -0,0 +1,29 @@
+{
+    "name": "bundler",
+    "version": "1.0.0",
+    "description": "Bundle PreTeXt CSS",
+    "private": true,
+    "scripts": {
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/PreTeXtBook/CSS_core.git"
+    },
+    "author": "",
+    "license": "GPL-3.0-or-later",
+    "bugs": {
+        "url": "https://github.com/PreTeXtBook/CSS_core/issues"
+    },
+    "homepage": "https://github.com/PreTeXtBook/CSS_core#readme",
+    "dependencies": {
+        "@fontsource/dejavu-serif": "^5.0.7",
+        "@fontsource/material-symbols-outlined": "^5.0.16",
+        "@fontsource/open-sans": "^5.0.17",
+        "@fontsource/roboto-serif": "^5.0.8",
+        "@fortawesome/fontawesome-free": "^6.4.2",
+        "@types/node": "^20.8.8",
+        "prismjs": "^1.29.0",
+        "vite": "^4.5.0"
+    }
+}
diff --git a/bundler/src/all/index.html b/bundler/src/all/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>CSS Bundler</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="./index.ts"></script>
+    </body>
+</html>
diff --git a/bundler/src/all/index.ts b/bundler/src/all/index.ts
@@ -0,0 +1,6 @@
+import "../default";
+import "../prism";
+import "../fontawesome";
+import "../fonts";
+
+export default {};
diff --git a/bundler/src/default/index.html b/bundler/src/default/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>CSS Bundler</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="./index.ts"></script>
+    </body>
+</html>
diff --git a/bundler/src/default/index.ts b/bundler/src/default/index.ts
@@ -0,0 +1,11 @@
+import "../../../pretext.css";
+import "../../../pretext_add_on.css";
+import "../../../shell_default.css";
+import "../../../banner_default.css";
+import "../../../navbar_default.css";
+import "../../../toc_default.css";
+import "../../../style_default.css";
+import "../../../colors_blue_red.css";
+import "../../../setcolors.css";
+
+export default {};
diff --git a/bundler/src/fontawesome/index.html b/bundler/src/fontawesome/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>CSS Bundler</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="./index.ts"></script>
+    </body>
+</html>
diff --git a/bundler/src/fontawesome/index.ts b/bundler/src/fontawesome/index.ts
@@ -0,0 +1,3 @@
+import "../../node_modules/@fortawesome/fontawesome-free/css/all.css";
+
+export default {};
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import "../../node_modules/@fortawesome/fontawesome-free/css/all.css";

		export default {};