11# MathJax (Source Repository)
22
33![ GitHub release version] ( https://img.shields.io/github/v/release/mathjax/MathJax-src.svg?sort=semver )
4+ ![ GitHub release version (v3)] ( https://img.shields.io/github/package-json/v/mathjax/MathJax/legacy-v3.svg?label=release-v3 )
45![ GitHub release version (v2)] ( https://img.shields.io/github/package-json/v/mathjax/MathJax/legacy-v2.svg?label=release-v2 )
56![ NPM version] ( https://img.shields.io/npm/v/mathjax.svg?style=flat )
67![ jsdelivr rank] ( https://flat.badgen.net/jsdelivr/rank/npm/mathjax?color=green )
1516## Beautiful math in all browsers
1617
1718MathJax is an open-source JavaScript display engine for LaTeX, MathML,
18- and AsciiMath notation that works in all modern browsers. It was
19- designed with the goal of consolidating the recent advances in web
20- technologies into a single, definitive, math-on-the-web platform
21- supporting the major browsers and operating systems. It requires no
22- setup on the part of the user (no plugins to download or software to
23- install), so the page author can write web documents that include
24- mathematics and be confident that users will be able to view it
25- naturally and easily. Simply include MathJax and some mathematics in
26- a web page, and MathJax does the rest.
19+ and AsciiMath notation that works in all modern browsers, with
20+ built-in support for assistive technology like screen readers,
21+ including automatic speech generation and an expression explorer that
22+ can be used to investigate typeset mathematics on a more granular
23+ level than the complete expression. It requires no setup on the part
24+ of the user (no plugins to download or software to install), so the
25+ page author can write web documents that include mathematics and be
26+ confident that users will be able to view it naturally and easily.
27+ Simply include MathJax and some mathematics in a web page, and MathJax
28+ does the rest.
2729
2830Some of the main features of MathJax include:
2931
@@ -63,52 +65,71 @@ need to install anything. Simply use a `script` tag that loads
6365MathJax from the CDN. E.g.,
6466
6567``` html
66- <script id = " MathJax-script " async src =" https://cdn.jsdelivr.net/npm/mathjax@3/es5/ tex-mml-chtml.js" ></script >
68+ <script src =" https://cdn.jsdelivr.net/npm/mathjax@4/ tex-mml-chtml.js" defer ></script >
6769```
68-
70+
6971See the [ MathJax
70- documentation] ( https://docs.mathjax.org/en/latest/index.html#browser-components ) ,
71- the [ MathJax Web Demos] ( https://github.com/mathjax/MathJax-demos-web ) ,
72- and the [ MathJax Component
73- Repository ] ( https://github.com/mathjax/MathJax-demos-web ) for more information.
72+ documentation] ( https://docs.mathjax.org/en/latest/index.html#browser-components )
73+ and the [ MathJax Web Demos] ( https://github.com/mathjax/MathJax-demos-web ) , and the [ MathJax
74+ Node Demos ] ( https://github.com/mathjax/ MathJax-demos-node ) for more
75+ information.
7476
7577
7678### Using MathJax Components in node applications
7779
78- To use MathJax components in a node application, install the ` mathjax ` package:
80+ To use MathJax components in a node application, install the ` mathjax `
81+ package:
7982
8083``` bash
81- npm install mathjax@3
84+ npm install mathjax@4
8285```
8386
84- (we are still making updates to version 2, so you should include ` @3 `
85- since the latest chronological version may not be version 3).
87+ Then import ` mathjax ` within your application and initialize it:
88+
89+ ``` js
90+ import MathJax from ' mathjax' ;
91+ await MathJax .init ({ ... });
92+ ```
8693
87- Then require ` mathjax ` within your application:
94+ where ` { ... } ` is the MathJax configuration you want to use. E.g.,
8895
89- ``` javascript
90- require (' mathjax' ).init ({ ... }).then ((MathJax ) => { ... });
96+ ``` js
97+ import MathJax from ' mathjax' ;
98+ await MathJax .init ({
99+ loader: {load: [' input/tex' , ' output/svg' ]}
100+ });
101+ const svg = await MathJax .tex2svgPromise (' \\ frac{1}{x^2-1}' , {display: true });
102+ console .log (MathJax .startup .adaptor .outerHTML (svg));
103+ ```
104+
105+
106+ Alternatively, in an ES5 node application, you can use
107+
108+ ``` js
109+ const MathJax = require (' mathjax' );
110+ MathJax .init ({ ... }).then (() => { ... });
91111```
92112
93113where the first ` { ... } ` is a MathJax configuration, and the second
94114` { ... } ` is the code to run after MathJax has been loaded. E.g.
95115
96- ``` javascript
97- require (' mathjax' ).init ({
116+ ``` js
117+ const MathJax = require (' mathjax' );
118+ MathJax .init ({
98119 loader: {load: [' input/tex' , ' output/svg' ]}
99- }).then ((MathJax ) => {
120+ }).then (() => {
100121 const svg = MathJax .tex2svg (' \\ frac{1}{x^2-1}' , {display: true });
101122 console .log (MathJax .startup .adaptor .outerHTML (svg));
102123}).catch ((err ) => console .log (err .message ));
103124```
104125
105- ** Note:** this technique is for node-based applications only, not for
106- browser applications. This method sets up an alternative DOM
107- implementation, which you don't need in the browser, and tells MathJax
108- to use node's ` require() ` command to load external modules. This
109- setup will not work properly in the browser, even if you webpack it or
110- bundle it in other ways .
111-
126+ ** Note:** the technique in the two examples above is for node-based
127+ application only, not for browser applications. This method sets up
128+ an alternative DOM implementation, which you don't need in the
129+ browser, and it depends on node and the local file system in other
130+ ways. This setup will not work properly in the browser, even if you
131+ webpack it or use some other bundler .
132+
112133See the
113134[ documentation] ( https://docs.mathjax.org/en/latest/index.html#server-nodejs )
114135and the [ MathJax Node
@@ -120,30 +141,30 @@ Repository](https://github.com/mathjax/MathJax-demos-node) for more details.
120141You can use the MathJax JavaScript files (as opposed to MathJax
121142components) directly in node applications. This gives you the
122143greatest flexibility, but requires more coding. To use this approach,
123- install the ` mathjax-full ` package:
144+ install the ` @ mathjax/src ` package:
124145
125- npm install mathjax-full
146+ npm install @ mathjax/src
126147
127148This will provide the following directories:
128149
129150 node_modules/
130- mathjax-full /
151+ @ mathjax/src /
131152 ts/ the MathJax source TypeScript files
132153 js/ the compiled JavaScript files
133154 components/ the component build tools and control files
134- es5/ the packages component files
155+ bundle/ the packages component files
135156
136157You can use the components and JavaScript files directly in your node
137158applications (see the [ MathJax node
138159demos] ( https://github.com/mathjax/MathJax-demos-node ) for examples).
139160
140- If you want to work from the GitHub repository directly, then do the following:
161+ If you want to work from the GitHub repository directly, then do the
162+ following:
141163
142164``` bash
143165git clone https://github.com/mathjax/MathJax-src.git mathjax-src
144166cd mathjax-src
145- npm run --silent compile
146- npm run --silent make-components
167+ npm run --silent build-all
147168```
148169
149170in order to compile the JavaScript files from the TypeScript source,
0 commit comments