Running the simple tex2svg with mjs extension?

[fireflysemantics]

Hi. This is a continuation from this issue.

I'm trying out the simple tex to SVG example and it will generate with this command:

node -r esm tex2svg

So I tried this:

cp tex2svg tex2svg.mjs

And then running it like this ( With error result):

ole@mkt:~/Temp/MathJax-demos-node/simple$ node tex2svg.mjs 
internal/modules/cjs/loader.js:821
  throw new ERR_REQUIRE_ESM(filename);
  ^

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /home/ole/Temp/MathJax-demos-node/MathJax-demos-node/simple/tex2svg.mjs
    at Object.Module._extensions..mjs (internal/modules/cjs/loader.js:821:9)
    at Module.load (internal/modules/cjs/loader.js:643:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Function.Module.runMain (internal/modules/cjs/loader.js:839:10)
    at internal/main/run_main_module.js:17:11

I was hoping this would work so that I could wrap the script in a function that takes the latex input and returns the SVG and then I could package that script in an NPM module and publish it so that the script can easily be used in other projects.

Any ideas?

[dpvc]

OK, it looks like using .mjs requires you to use import and export, so you can't use the usual node require() command. Sigh.

How about switching to one of the other versions of tex2svg, say the one in the components directory? If you change the default for the --dist option (by changing default: false to default: true in

        dist: {
            boolean: true,
            default: false,
            describe: 'true to use webpacked version, false to use MathJax source files'
        }

then you can use node tex2svg without error.

[fireflysemantics]

I tried using the components code:

#! /usr/bin/env -S node -r esm

/*************************************************************************
 *
 *  component/tex2svg
 *
 *  Uses MathJax v3 to convert a TeX string to an SVG string.
 *
 * ----------------------------------------------------------------------
 *
 *  Copyright (c) 2019 The MathJax Consortium
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

//
//  The default TeX packages to use
//
const PACKAGES = 'base, autoload, require, ams, newcommand';
const latex = `$$MAD = \\frac{\\sum_{i=1}^n | x_i - \\bar{x} |} n$$`;

//
//  Get the command-line arguments
//
var argv = require('yargs')
    .demand(0).strict()
    .usage('$0 [options] "math" > file.svg')
    .options({
        inline: {
            boolean: true,
            describe: "process as inline math"
        },
        em: {
            default: 16,
            describe: 'em-size in pixels'
        },
        ex: {
            default: 8,
            describe: 'ex-size in pixels'
        },
        width: {
            default: 80 * 16,
            describe: 'width of container in pixels'
        },
        packages: {
            default: PACKAGES,
            describe: 'the packages to use, e.g. "base, ams"; use "*" to represent the default packages, e.g, "*, bbox"'
        },
        css: {
            boolean: true,
            describe: 'output the required CSS rather than the HTML itself'
        },
        fontCache: {
            boolean: true,
            default: true,
            describe: 'whether to use a local font cache or not'
        },
        assistiveMml: {
            boolean: true,
            default: false,
            describe: 'whether to include assistive MathML output'
        },
        dist: {
            boolean: true,
            default: true,
            describe: 'true to use webpacked version, false to use MathJax source files'
        }
    })
    .argv;

//
// Configure MathJax
//
MathJax = {
    options: {
        enableAssistiveMml: argv.assistiveMml
    },
    loader: {
        paths: {mathjax: 'mathjax-full/es5'},
        source: (argv.dist ? {} : require('mathjax-full/components/src/source.js').source),
        require: require,
        load: ['adaptors/liteDOM']
    },
    tex: {
        packages: argv.packages.replace('\*', PACKAGES).split(/\s*,\s*/)
    },
    svg: {
        fontCache: (argv.fontCache ? 'local' : 'none')
    },
    startup: {
        typeset: false
    }
}

//
//  Load the MathJax startup module
//
require('mathjax-full/' + (argv.dist ? 'es5' : 'components/src/tex-svg') + '/tex-svg.js');

//
//  Wait for MathJax to start up, and then typeset the math
//
MathJax.startup.promise.then(() => {
    MathJax.tex2svgPromise(latex, {
        display: !argv.inline,
        em: argv.em,
        ex: argv.ex,
        containerWidth: argv.width
    }).then((node) => {
        const adaptor = MathJax.startup.adaptor;
        //
        //  If the --css option was specified, output the CSS,
        //  Otherwise, output the typeset math as SVG
        //
        if (argv.css) {
            console.log(adaptor.textContent(MathJax.svgStylesheet()));
        } else {
            console.log(adaptor.outerHTML(node));
        };
    });
}).catch(err => console.log(err));

Here's what happens when I run it:

ole@mkt:~/Temp/MathJax-demos-node/MathJax-demos-node/component$ node tex2svg
/home/ole/Temp/MathJax-demos-node/MathJax-demos-node/node_modules/mathjax-full/components/src/source.js:3
export const source = {
^^^^^^

SyntaxError: Unexpected token export
    at Module._compile (internal/modules/cjs/loader.js:720:23)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:643:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Module.require (internal/modules/cjs/loader.js:683:19)
    at require (internal/modules/cjs/helpers.js:16:16)
    at Object.<anonymous> (/home/ole/Temp/MathJax-demos-node/MathJax-demos-node/component/tex2svg:112:35)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:643:32)

[dpvc]

Are you sure you are running the modified version and not ehe original? Your code works for me without trouble.

If you really are running this version, then just remove the

        source: (argv.dist ? {} : require('mathjax-full/components/src/source.js').source),

entirely.

Also, you might want to fetch the most recent version of the MAthJax-demos-node repository, as it was updated for the recent 3.1.4 release.

[fireflysemantics]

OK - I fetched the most recent version and now it works. I'm able to run with node tex2svg. Brilliant - So happy about this! Thanks again! I think this should be pretty easy to wrap now.

[dpvc]

OK, glad it is working now. I will close the issue.