Files
KaTeX/katex.js
ylemkimon 5f32b71c85 Use webpack to build files and webpack-dev-server for testing (#1068)
* Create a separate entry point for webpack

Created a webpack entry point for KaTeX, which imports katex.less. As
flow[1] and jest[2] doesn't support CSS modules natively, a separate
entry point is used and it is not flowtyped.

[1] https://gist.github.com/lambdahands/d19e0da96285b749f0ef
[2] https://facebook.github.io/jest/docs/en/webpack.html

* Use webpack to build files

* Made webpack.config.js export valid webpack configuration
* Use:
browserify -> webpack
babelify -> babel-loader
UglifyJS CLI -> UglifyJsPlugin
Less CLI -> less-loader
cleancss -> cssnano in css-loader
build/fonts -> file-loader
* Inline CSS(Less) using style-loader and export them using
ExtractTextPlugin
* Add `watch` npm script calling `webpack --watch`

* Improve local testing(webpack-dev-server)

* Made webpackDevServer export a valid webpack configuration
* Compile Less and inline CSS using less-loader and style-loader
* Instead of copying files serve files from /static and use file-loader
* Remove old server.js and its dependencies

* Use webpack-dev-server in Screenshotter

* Include contrib in webpack-dev-server

+ Moved common configurations to webpack.common.js

* Rename webpackDevServer.js to webpack.dev...

to be consistent, avoid confusion with webpack-dev-server and follow
webpack configuration naming convention.

* Remove unnecessary conditional output.path

* Use map instead of reduce

+ Add comments regarding function arguments

* Remove unnecessary mkdir and clean build/* before build

* Use katex as external dependency instead of global variable in contrib

Fixes #692.

* Unblock codes as they are built as a module

* Update package-lock.json

* Add comments regarding devServer option

* Lint renamed webpack.dev.js

a0d8b33

* Export ES6 module and expose its default export

* Revert "Browserify hotfix (#1057)"

This reverts commit f6b509123b.

* Enables colors on the console when running the dev server in Screenshotter

* Add context to webpack configuration

Allows webpack to be run from other directories

* Move `rm -rf build/*` to npm scripts

* Check dependencies before build

* Move UglifyJsPlugin into config creation

* Let webpack handle ES6 modules

Do not transform modules to commonjs in Babel. However Jest doesn't not
support ES6 modules, so transfrom modules to commonjs when NODE_ENV is
`test`.

* Add documentation on testing in IE 9 and 10 using webpack-dev-server

Changed version range to include IE-compatible version
2018-01-21 19:48:25 -05:00

141 lines
4.2 KiB
JavaScript

// @flow
/* eslint no-console:0 */
/**
* This is the main entry point for KaTeX. Here, we expose functions for
* rendering expressions either to DOM nodes or to markup strings.
*
* We also expose the ParseError class to check if errors thrown from KaTeX are
* errors in the expression, or errors in javascript handling.
*/
import ParseError from "./src/ParseError";
import Settings from "./src/Settings";
import { buildTree, buildHTMLTree } from "./src/buildTree";
import parseTree from "./src/parseTree";
import utils from "./src/utils";
import type {SettingsOptions} from "./src/Settings";
import type ParseNode from "./src/ParseNode";
/**
* Parse and build an expression, and place that expression in the DOM node
* given.
*/
let render = function(
expression: string,
baseNode: Node,
options: SettingsOptions,
) {
utils.clearNode(baseNode);
const node = renderToDomTree(expression, options).toNode();
baseNode.appendChild(node);
};
// KaTeX's styles don't work properly in quirks mode. Print out an error, and
// disable rendering.
if (typeof document !== "undefined") {
if (document.compatMode !== "CSS1Compat") {
typeof console !== "undefined" && console.warn(
"Warning: KaTeX doesn't work in quirks mode. Make sure your " +
"website has a suitable doctype.");
render = function() {
throw new ParseError("KaTeX doesn't work in quirks mode.");
};
}
}
/**
* Parse and build an expression, and return the markup for that.
*/
const renderToString = function(
expression: string,
options: SettingsOptions,
): string {
const markup = renderToDomTree(expression, options).toMarkup();
return markup;
};
/**
* Parse an expression and return the parse tree.
*/
const generateParseTree = function(
expression: string,
options: SettingsOptions,
): ParseNode[] {
const settings = new Settings(options);
return parseTree(expression, settings);
};
/**
* Generates and returns the katex build tree. This is used for advanced
* use cases (like rendering to custom output).
*/
const renderToDomTree = function(
expression: string,
options: SettingsOptions,
) {
const settings = new Settings(options);
const tree = parseTree(expression, settings);
return buildTree(tree, expression, settings);
};
/**
* Generates and returns the katex build tree, with just HTML (no MathML).
* This is used for advanced use cases (like rendering to custom output).
*/
const renderToHTMLTree = function(
expression: string,
options: SettingsOptions,
) {
const settings = new Settings(options);
const tree = parseTree(expression, settings);
return buildHTMLTree(tree, expression, settings);
};
export default {
/**
* Renders the given LaTeX into an HTML+MathML combination, and adds
* it as a child to the specified DOM node.
*/
render,
/**
* Renders the given LaTeX into an HTML+MathML combination string,
* for sending to the client.
*/
renderToString,
/**
* KaTeX error, usually during parsing.
*/
ParseError,
/**
* Parses the given LaTeX into KaTeX's internal parse tree structure,
* without rendering to HTML or MathML.
*
* NOTE: This method is not currently recommended for public use.
* The internal tree representation is unstable and is very likely
* to change. Use at your own risk.
*/
__parse: generateParseTree,
/**
* Renders the given LaTeX into an HTML+MathML internal DOM tree
* representation, without flattening that representation to a string.
*
* NOTE: This method is not currently recommended for public use.
* The internal tree representation is unstable and is very likely
* to change. Use at your own risk.
*/
__renderToDomTree: renderToDomTree,
/**
* Renders the given LaTeX into an HTML internal DOM tree representation,
* without MathML and without flattening that representation to a string.
*
* NOTE: This method is not currently recommended for public use.
* The internal tree representation is unstable and is very likely
* to change. Use at your own risk.
*/
__renderToHTMLTree: renderToHTMLTree,
};