ES6 class keyword used in "ES5" code due to bundled speech-rule-engine dependency
hallvors opened this issue · comments
Hi, I came across an issue that causes a syntax error if one tries to use MathJax with the PrinceXML JavaScript engine. I suppose it will also cause trouble in many other older browser that do not support ES6 class
.
prince: https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js:1: error: SyntaxError: unexpected token reserved("class")
It is a little confusing that a URL which contains the string "es5" uses the class keyword :) .
I checked out the repository and the TS compiler does not output class statement anywhere if I run npm run compile
. However, the make-components
command that uses Node.js scripts and Webpack to compile all the sub-components MathJax consists of, unfortunately outputs stuff like
class Q extends o.AbstractAudioRenderer {
or
e.Span = class {
Now, there's no MathJax component defining an AbstractAudioRenderer. This seems to come from a dependency which gets bundled into the Mathjax scripts by Webpack (but not compiled / transpiled to ES5 in the process - Webpack configurations tend to assume stuff in dependencies does not need transpiling). The dependency that ships ES6 code which gets bundled is most likely https://www.npmjs.com/package/speech-rule-engine
Is it possible to enable Babel loader or similar transpiling for this dependency? I know it works as-is with most browsers out there, but at least the URL saying es5 would be more truthful if it were possible to also transpile speech-rule-engine :)
Thanks for your attention and the amazing library.
Thanks for reporting this issue. You are correct that the speech-rule-engine is the culprit, here, and should be transpired for the es5
directory.
One work-around for now would be to edit components/webpack.common.js
and change
MathJax-src/components/webpack.common.js
Lines 135 to 136 in 8565f9d
to
test: new RegExp(dirRE + quoteRE(path.sep) + '.*\\.js$|speech-rule-engine'),
exclude: new RegExp(quoteRE(path.join(path.dirname(__dirname), 'es5') + path.sep) + '|.json$'),
which will cause the speech-rule-engine files to be transpired, excluding its .json
files. Then repack the needed component:
components/bin/makeAll components/src/tex-svg
That seems to do the trick in my (limited) testing.
I take it back. While the resulting file doesn't include class definitions, it also doesn't work in the browser. So I'll have to look into it further.
OK, it looks like you also need to
npm install regenerator-runtime
and change
MathJax-src/components/webpack.common.js
Line 163 in 8565f9d
to
entry: ['regenerator-runtime/runtime.js', path.join(dir, name + '.js')],
then it seems to work. It also increases the size of the resulting file by 300K or so (unfortunately).