release 0.10.1: expose API more consistently and include a build for …

…the browser * html-generator.ls now checks if window is defined, not test.ls anymore * added index.js as the new main entry point * made bin/latex.js executable
michael-brade · Aug 1, 2018 · a5188a4 · a5188a4
1 parent f1ad577
commit a5188a4
Show file tree

Hide file tree

Showing 7 changed files with 154 additions and 24 deletions.
diff --git a/README.md b/README.md
@@ -14,18 +14,31 @@ You can play with it here:
 
 ## Installation
 
+For CLI usage install it globally:
+
 ```
 npm install -g latex.js
 ```
 
+For library usage add it to your project:
+
+```
+npm install --save-prod latex.js
+```
+
+
+
 ## Usage
 
 LaTeX.js is divided into a parser and a generator, so that in theory you could switch the
 generator to create e.g. plain text instead of HTML. Currently, only a HTML generator exists.
 
 LaTeX.js can parse full LaTeX documents as well as documents without a preamble and only the
 text that comes between `\begin{document}` and `\end{document}` in a full LaTeX document. In
-that latter case, the default documentclass is used, which is article unless specified otherwise.
+that latter case, the default documentclass is used, which is `article` unless specified otherwise.
+
+
+### CLI
 
 The CLI has the following options:
 
@@ -53,11 +66,72 @@ Options:
 If no input files are given, STDIN is read.
 ```
 
+### Library
+
+Import the parser and generator, then parse and translate to HTML:
+
+```js
+import { parse, HtmlGenerator } from 'latex.js'
+
+let text = "Hi, this is a line of text."
+
+
+let generator = new HtmlGenerator({ hyphenate: false, bare: true })
+
+let html = parse(text, { generator: generator }).html()
+
+console.log(html)
+```
+
+
+### In the Browser
+
+You can either use your own build or use a link directly to the jsDelivr CDN:
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+  <meta charset="UTF-8">
+  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+  <meta http-equiv="content-language" content="en">
+
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+
+  <!-- <script src="node_modules/latex.js/dist/latex.min.js"></script> -->
+  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/latex.min.js"></script>
+
+  <title>LaTeX.js Test</title>
+</head>
+
+<body>
+  <h1>Compiling LaTeX</h1>
+
+  <script>
+    var text = "Hi, this is a line of text."
+
+    var generator = new latexjs.HtmlGenerator({ hyphenate: false, bare: true })
+
+    var dom = latexjs.parse(text, { generator: generator }).dom()
+
+    document.body.appendChild(dom)
+  </script>
+</body>
+
+</html>
+```
+
+
+
+
 ## Tests
 
 To build it and run the tests, clone this repository and execute:
 
 ```
+npm install
 npm run build   # or devbuild
 npm test
 ```
@@ -95,9 +169,9 @@ TODO: write documentation
 
 - I don't create an intermediate AST yet, so TeX's conditional expressions are impossible
 - deprecated macros, or macros that are not supposed to be used in LaTeX, won't even exist in LaTeX.js.
-  Examples include: eqnarray, the old LaTeX 2.09 font macros \it, \sl, etc. Also missing are most of the plainTeX macros.
+  Examples include: `eqnarray`, the old LaTeX 2.09 font macros `\it`, `\sl`, etc. Also missing are most of the plainTeX macros.
   See also [`l2tabuen.pdf`](ftp://ftp.dante.de/tex-archive/info/l2tabu/english/l2tabuen.pdf).
-- incorrect but legal markup in LaTeX won't produce the same result in LaTeX.js - like when using \raggedleft in the
+- incorrect but legal markup in LaTeX won't produce the same result in LaTeX.js - like when using `\raggedleft` in the
   middle of a paragraph; but the LaTeX.js result should be intuitively correct.
 - because of the limitations when parsing TeX as a context-free grammar (see [below](#parsing-tex)), native LaTeX packages
   cannot be parsed and loaded. Instead, the macros those packages (and documentclasses) provide have to be implemented in

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "latex.js",
   "description": "JavaScript LaTeX to HTML5 translator",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "author": {
     "name": "Michael Brade",
     "email": "[email protected]"
@@ -12,32 +12,46 @@
     "parser",
     "html5"
   ],
-  "main": "dist/latex-parser.js",
   "bin": {
     "latex.js": "./bin/latex.js"
   },
+  "main": "dist/index.js",
+  "browser": "dist/latex.min.js",
   "files": [
     "bin/latex.js",
+    "dist/index.js",
     "dist/latex-parser.js",
     "dist/macros.js",
     "dist/symbols.js",
     "dist/html-generator.js",
     "dist/documentclasses/",
     "dist/css/",
     "dist/fonts/",
-    "dist/js/"
+    "dist/js/",
+    "dist/latex.min.js"
   ],
   "scripts": {
     "clean": "rimraf dist bin;",
-    "build": "npm run devbuild;uglifyjs dist/plugin-pegjs.js            -cm -o dist/plugin-pegjs.js;uglifyjs dist/latex-parser.js            -cm -o dist/latex-parser.js;uglifyjs dist/macros.js                  -cm -o dist/macros.js;uglifyjs dist/symbols.js                 -cm -o dist/symbols.js;uglifyjs dist/html-generator.js          -cm -o dist/html-generator.js;uglifyjs dist/documentclasses/base.js    -cm -o dist/documentclasses/base.js;uglifyjs dist/documentclasses/article.js -cm -o dist/documentclasses/article.js;uglifyjs dist/documentclasses/book.js    -cm -o dist/documentclasses/book.js;uglifyjs dist/documentclasses/report.js  -cm -o dist/documentclasses/report.js;mkdirp bin;lsc -bc --no-header -o bin src/latex.js.ls;",
-    "devbuild": "mkdirp dist/documentclasses;mkdirp dist/css;mkdirp dist/js;mkdirp dist/fonts;rsync -a src/css/ dist/css/;rsync -a src/fonts/ dist/fonts/;rsync -a src/js/ dist/js/;lsc -c -o dist src/plugin-pegjs.ls src/symbols.ls src/macros.ls src/html-generator.ls;lsc -c -o dist/documentclasses src/documentclasses/;pegjs -o dist/latex-parser.js --plugin ./dist/plugin-pegjs src/latex-parser.pegjs;",
+    "build": "npm run devbuild;uglifyjs dist/index.js                   -cm -o dist/index.js;uglifyjs dist/plugin-pegjs.js            -cm -o dist/plugin-pegjs.js;uglifyjs dist/latex-parser.js            -cm -o dist/latex-parser.js;uglifyjs dist/macros.js                  -cm -o dist/macros.js;uglifyjs dist/symbols.js                 -cm -o dist/symbols.js;uglifyjs dist/html-generator.js          -cm -o dist/html-generator.js;uglifyjs dist/documentclasses/base.js    -cm -o dist/documentclasses/base.js;uglifyjs dist/documentclasses/article.js -cm -o dist/documentclasses/article.js;uglifyjs dist/documentclasses/book.js    -cm -o dist/documentclasses/book.js;uglifyjs dist/documentclasses/report.js  -cm -o dist/documentclasses/report.js;mkdirp bin;lsc -bc --no-header -o bin src/latex.js.ls;chmod a+x bin/latex.js;",
+    "devbuild": "mkdirp dist/documentclasses;mkdirp dist/css;mkdirp dist/js;mkdirp dist/fonts;rsync -a src/css/ dist/css/;rsync -a src/fonts/ dist/fonts/;rsync -a src/js/ dist/js/;lsc -c -o dist src/plugin-pegjs.ls src/symbols.ls src/macros.ls src/html-generator.ls;lsc -c -o dist/documentclasses src/documentclasses/;pegjs -o dist/latex-parser.js --plugin ./dist/plugin-pegjs src/latex-parser.pegjs;babel -o dist/index.js src/index.js;",
     "docs": "npm run devbuild && webpack && uglifyjs -cm -o docs/js/playground.bundle.pack.js docs/js/playground.bundle.js;",
     "pgcc": "google-closure-compiler --compilation_level SIMPLE --externs src/externs.js --js_output_file docs/js/playground.bundle.pack.js docs/js/playground.bundle.js;",
     "test": "mocha test/tests.ls;",
     "iron": "iron-node node_modules/.bin/_mocha test/tests.ls;",
     "cover": "istanbul cover --dir test/coverage _mocha test/tests.ls;"
   },
   "babel": {
+    "presets": [
+      [
+        "@babel/preset-env",
+        {
+          "targets": {
+            "node": "current",
+            "browsers": "> 0.5%, not dead"
+          }
+        }
+      ]
+    ],
     "plugins": [
       "@babel/syntax-object-rest-spread"
     ]
@@ -67,8 +81,10 @@
     "webpack-closure-compiler": "2.x",
     "babel-loader": "8.0.0-beta.3",
     "copy-webpack-plugin": "4.5.x",
+    "@babel/cli": "7.0.0-beta.55",
     "@babel/core": "7.0.0-beta.55",
     "@babel/register": "7.0.0-beta.55",
+    "@babel/preset-env": "7.0.0-beta.55",
     "@babel/plugin-syntax-object-rest-spread": "7.0.0-beta.55",
     "mocha": "5.x",
     "chai": "4.x",

diff --git a/package.json.sh b/package.json.sh
@@ -2,7 +2,7 @@
 
 name: 'latex.js'
 description: 'JavaScript LaTeX to HTML5 translator'
-version: '0.10.0'
+version: '0.10.1'
 
 author:
     'name': 'Michael Brade'
@@ -14,15 +14,18 @@ keywords:
     'parser'
     'html5'
 
+bin:
+    'latex.js': './bin/latex.js'
 
 main:
-    'dist/latex-parser.js'
+    'dist/index.js'
 
-bin:
-    'latex.js': './bin/latex.js'
+browser:
+    'dist/latex.min.js'
 
 files:
     'bin/latex.js'
+    'dist/index.js'
     'dist/latex-parser.js'
     'dist/macros.js'
     'dist/symbols.js'
@@ -31,12 +34,14 @@ files:
     'dist/css/'
     'dist/fonts/'
     'dist/js/'
+    'dist/latex.min.js'
 
 
 scripts:
     clean: 'rimraf dist bin;'
     build: "
         npm run devbuild;
+        uglifyjs dist/index.js                   -cm -o dist/index.js;
         uglifyjs dist/plugin-pegjs.js            -cm -o dist/plugin-pegjs.js;
         uglifyjs dist/latex-parser.js            -cm -o dist/latex-parser.js;
         uglifyjs dist/macros.js                  -cm -o dist/macros.js;
@@ -49,6 +54,7 @@ scripts:
 
         mkdirp bin;
         lsc -bc --no-header -o bin src/latex.js.ls;
+        chmod a+x bin/latex.js;
     "
     devbuild: "
         mkdirp dist/documentclasses;
@@ -61,6 +67,7 @@ scripts:
         lsc -c -o dist src/plugin-pegjs.ls src/symbols.ls src/macros.ls src/html-generator.ls;
         lsc -c -o dist/documentclasses src/documentclasses/;
         pegjs -o dist/latex-parser.js --plugin ./dist/plugin-pegjs src/latex-parser.pegjs;
+        babel -o dist/index.js src/index.js;
     "
     docs:  'npm run devbuild && webpack && uglifyjs -cm -o docs/js/playground.bundle.pack.js docs/js/playground.bundle.js;'
     pgcc:  "google-closure-compiler --compilation_level SIMPLE \
@@ -71,6 +78,13 @@ scripts:
     cover: 'istanbul cover --dir test/coverage _mocha test/tests.ls;'
 
 babel:
+    presets:
+        * '@babel/preset-env'
+            targets:
+                node: 'current'
+                browsers: '> 0.5%, not dead'
+        ...
+
     plugins:
         '@babel/syntax-object-rest-spread'
         ...
@@ -114,8 +128,10 @@ devDependencies:
     'babel-loader': '8.0.0-beta.3'
     'copy-webpack-plugin': '4.5.x'
 
+    '@babel/cli': '7.0.0-beta.55'
     '@babel/core': '7.0.0-beta.55'
     '@babel/register': '7.0.0-beta.55'
+    '@babel/preset-env': '7.0.0-beta.55'
     '@babel/plugin-syntax-object-rest-spread': '7.0.0-beta.55'
 
 

diff --git a/src/html-generator.ls b/src/html-generator.ls
@@ -1,5 +1,11 @@
 'use strict'
 
+if global.window is undefined
+    # on the server we need to include a DOM implementation - but hide the require from webpack
+    global.window = eval('require')('svgdom')
+    global.document = window.document
+
+
 require! {
     './symbols': { ligatures, diacritics, symbols }
     './macros': { LaTeXBase: Macros }

diff --git a/src/index.js b/src/index.js
@@ -0,0 +1,2 @@
+export * from './latex-parser';
+export { HtmlGenerator } from './html-generator';
diff --git a/test/tests.ls b/test/tests.ls
@@ -9,14 +9,6 @@ require! {
     pngjs: { PNG }
 }
 
-# on the server we need to include a DOM implementation
-global.window = require 'svgdom'
-global.document = window.document
-
-
-# svgdom.setFontDir '../src/fonts'
-#       .setFont
-
 const HtmlGenerator   = require '../dist/html-generator' .HtmlGenerator
 const html-beautify   = require 'js-beautify' .html
 const latexjs         = require '../dist/latex-parser'

diff --git a/webpack.config.js b/webpack.config.js
@@ -2,12 +2,10 @@ const path = require('path');
 const webpack = require('webpack');
 const CopyPlugin = require('copy-webpack-plugin');
 
-module.exports = {
-    // mode: 'production',
+module.exports = [{
     mode: 'development',
     devtool: false, //'source-map',
 
-    context: __dirname,
     entry: './docs/js/playground.js',
     output: {
         path: path.resolve(__dirname, 'docs'),
@@ -34,4 +32,30 @@ module.exports = {
     stats: {
         colors: true
     }
-};
+}, {
+    mode: 'production',
+    devtool: false,
+
+    context: path.resolve(__dirname, "dist"),
+    entry: './index.js',
+    output: {
+        filename: 'latex.min.js',
+        libraryTarget: "umd",
+        library: "latexjs",
+        umdNamedDefine: true
+    },
+    module: {
+        rules: [{
+            test: /\.js$/,
+            exclude: /(node_modules)/,
+            use: 'babel-loader'
+        }]
+    },
+    performance: {
+        maxEntrypointSize: 512000,
+        maxAssetSize: 512000
+    },
+    stats: {
+        colors: true
+    }
+}];