Use local built CSS and fonts for master documentation (#1584)

* Change `npm run` to `yarn`

* Export `commander` program if required as module

* Move `prestart` (cli.md generation) to build.js

* Normalize script names

* Change `yarn prestart` to `node lib/build.js`

* Use local built CSS and fonts

* Move stylesheet after the first paragraph

* Remove prestart script

.gitignore

@@ -24,3 +24,5 @@ website/build/
 website/yarn.lock
 website/node_modules
 website/i18n/*
+website/static/static/katex.*
+website/static/static/fonts

.stylelintrc

@@ -2,5 +2,8 @@
     "extends": "stylelint-config-standard",
     "rules": {
         "indentation": 4,
-    }
+    },
+    "ignoreFiles": [
+        "**/*.min.css"
+    ]
 }

cli.js

@@ -62,22 +62,13 @@ const program = require("commander")
     .option("-i, --input <path>", "Read LaTeX input from the given file.")
     .option("-o, --output <path>", "Write html output to the given file.");
 
-program.command('markdown-help')
+if (require.main !== module) {
-    .description('Print markdown version of the help')
+    module.exports = program;
-    .action(() => {
+    return;
-        console.log();
+}
-        console.log(program.options.map(option => `### \`${option.flags}\`
-${option.description}${((option.bool && option.defaultValue !== undefined)
-    ? ' (default: ' + option.defaultValue + ')' : '')}
-`)
-            .concat(['### `-h, --help`\nOutput usage information'])
-            .join('\n'));
-        process.exit();
-    });
 
 const options = program.parse(process.argv);
 
-
 function readMacros() {
     if (options.macroFile) {
         fs.readFile(options.macroFile, "utf-8", function(err, data) {

docs/support_table.md

@@ -2,7 +2,11 @@
 id: support_table
 title: Support Table
 ---
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0-beta/dist/katex.min.css" integrity="sha384-9tPv11A+glH/on/wEu99NVwDPwkMQESOocs/ZGXPoIiLE8MU/qkqUcZ3zzL+6DuH" crossorigin="anonymous">
+This is a list of TeX functions, sorted alphabetically. This list includes functions that KaTeX supports and some that it doesn't support. There is a similar page, with functions [sorted by type](./supported.md).
+
+If you know the shape of a character, but not its name, [Detexify](http://detexify.kirelabs.org/classify.html) can help.
+
+{@stylesheet: katex.min.css}
 <style>
 table tr,
 table td {
@@ -10,10 +14,6 @@ table td {
 }
 </style>
 
-This is a list of TeX functions, sorted alphabetically. This list includes functions that KaTeX supports and some that it doesn't support. There is a similar page, with functions [sorted by type](./supported.md).
-
-If you know the shape of a character, but not its name, [Detexify](http://detexify.kirelabs.org/classify.html) can help.
-
 ## Symbols
 
 |Symbol/Function |  Rendered   | Source or Comment|

docs/supported.md

@@ -2,7 +2,11 @@
 id: supported
 title: Supported Functions
 ---
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0-beta/dist/katex.min.css" integrity="sha384-9tPv11A+glH/on/wEu99NVwDPwkMQESOocs/ZGXPoIiLE8MU/qkqUcZ3zzL+6DuH" crossorigin="anonymous">
+This is a list of TeX functions supported by KaTeX. It is sorted into logical groups.
+
+There is a similar [Support Table](./support_table.md), sorted alphabetically, that lists both supported and un-supported functions.
+
+{@stylesheet: katex.min.css}
 <style>
 p {overflow-wrap: break-word;}
 table tr,
@@ -15,9 +19,6 @@ table td {
     margin-left: 10px !important;
 }
 </style>
-This is a list of TeX functions supported by KaTeX. It is sorted into logical groups.
-
-There is a similar [Support Table](./support_table.md), sorted alphabetically, that lists both supported and un-supported functions.
 
 <div class="katex-hopscotch">
 

release.sh

@@ -116,9 +116,9 @@ sed -i.bak -E '/^\/dist\/$/d' .gitignore
 rm -f .gitignore.bak
 git add .gitignore dist/
 
-# Edit docs to use CSS from CDN (#1520)
+# Edit docs to use CSS from CDN
-# grep -l '{@stylesheet: static/katex.min.css}' docs/*.md | xargs sed -i.bak \
+grep -l '{@stylesheet: katex.min.css}' docs/*.md | xargs sed -i.bak \
-#     's|{@stylesheet: static/katex.min.css}|<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@./dist/katex.min.css" integrity="sha256-katex.min.css" crossorigin="anonymous"/>|'
+    's|{@stylesheet: katex.min.css}|<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@./dist/katex.min.css" integrity="sha384-katex.min.css" crossorigin="anonymous"/>|'
 
 # Update the version number in CDN URLs included in the README and the documentation,
 # and regenerate the Subresource Integrity hash for these files.
@@ -130,9 +130,9 @@ pushd website
 yarn run version "${VERSION}"
 
 # Restore docs to use local built CSS
-# for file in ../docs/*.md.bak; do
+for file in ../docs/*.md.bak; do
-#     mv -f "$file" "${file%.bak}"
+    mv -f "$file" "${file%.bak}"
-# done
+done
 
 USE_SSH=true yarn publish-gh-pages
 popd

website/lib/build.js

@@ -0,0 +1,16 @@
+const fs = require('fs-extra');
+
+// generate cli.md
+const cli = require('../../cli');
+const template = fs.readFileSync('../docs/cli.md.template');
+
+fs.writeFileSync('../docs/cli.md', [template,
+    ...cli.options.map(option => `### \`${option.flags}\`
+${option.description}${((option.bool && option.defaultValue !== undefined)
+? ' (default: ' + option.defaultValue + ')' : '')}
+`),
+    '### `-h, --help`\nOutput usage information', ''].join('\n'));
+
+// copy local built CSS and fonts
+fs.copySync('../dist/katex.min.css', 'static/static/katex.min.css');
+fs.copySync('../dist/fonts', 'static/static/fonts');

website/package.json

@@ -1,15 +1,16 @@
 {
   "scripts": {
-    "prestart": "cp ../docs/cli.md.template ../docs/cli.md && node ../cli.js markdown-help >> ../docs/cli.md",
+    "start": "node lib/build.js && docusaurus-start",
-    "start": "docusaurus-start",
+    "build": "node lib/build.js && docusaurus-build",
-    "build": "npm run prestart && docusaurus-build",
+    "publish-gh-pages": "node lib/build.js && docusaurus-publish",
-    "publish-gh-pages": "npm run prestart && docusaurus-publish",
     "write-translations": "docusaurus-write-translations",
-    "version": "npm run prestart && docusaurus-version",
+    "version": "node lib/build.js && docusaurus-version",
     "rename-version": "docusaurus-rename-version"
   },
   "devDependencies": {
-    "docusaurus": "^1.3.2"
+    "docusaurus": "^1.3.2",
+    "fs-extra": "^7.0.0",
+    "remarkable-embed": "^0.4.1"
   },
   "dependencies": {}
 }

website/siteConfig.js

@@ -12,6 +12,14 @@
 // If on netlify, use '/'. Otherwise use '/KaTeX/'.
 const baseUrl = process.env.BASE_URL || (process.env.CONTEXT ? '/' : '/KaTeX/');
 
+// Plugin for Remarkable to inject variables
+const {Plugin: Embed} = require('remarkable-embed');
+const embed = new Embed();
+
+ // {@stylesheet: path}
+embed.register('stylesheet',
+    path => `<link rel="stylesheet" href="${baseUrl}static/${path}"/>`);
+
 /* List of projects/orgs using your project for the users page */
 const users = [
     {
@@ -66,8 +74,9 @@ const siteConfig = {
     },
 
     markdownPlugins: [
-        require('./lib/remarkableKatex'),
+        embed.hook,
-        require('./lib/empty_thead'),
+        require('./lib/remarkable-katex'),
+        require('./lib/empty-thead'),
     ],
 
     scripts: [