Search code examples
htmlconfigurationmathjax

Physics package does not load with MathJax on test web page

I have created this simple html file to test various configurations for MathJax. In this example the file loads the latest version of MathJax with a configuration file TeX-AMS-MML_HTMLorMML from a cdn. The inline configuration loads the physics package:

<head>
    <title>MathJax TeX Test Page</title>
    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
        tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
        TeX: { equationNumbers: { autoNumber: "AMS" } },
        loader: {load: ['[tex]/physics']},
        tex: {packages: {'[+]': ['physics']}},
        "HTML-CSS": {
          fonts: ["TeX"],
        }
      });
    </script>
    <script type="text/javascript"
    src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
    </script>
    <!---->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Audiowide|Sofia|Tai+Heritage+Pro|Trykker|Tiro+Telugu|Vesper+Libre|Brawler|Georama|Fjord+One|Trirong|Fresca|Anonymous+Pro|Baskervville">
<style>
  body {
    font-family: 'Baskervville', serif;
    font-size: 20px;
  }
</style>
</head>
<body>
    When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
    \begin{equation}
    \color{red}{x = {-b \pm \sqrt{b^2-4ac} \over 2a}}.  
    \end{equation}
    For some reason I use $ \qty[ c ] $...
</body>

The output is:

enter image description here By the way I have tried using \require{physics} but it does not work.

Solution

  • You are mixing MathJax v2 and v3 configuration styles and still linking to the long retired mathjax CDN.

    The physics package is only available with MathJax v3. The following matches your configuration.

    <script>
window.MathJax = {
  loader: {
    load: ['[tex]/physics']
  },
  tex: { 
    inlineMath: [['$', '$'], ['\\(', '\\)']],
    tags: 'ams',
    packages: {'[+]': ['physics']}
  } 
};

</script>
<script type="text/javascript" id="MathJax-script" async
  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
</script>

  $\qty[c]$ etc.

\begin{equation}
 \acosecant x 
\end{equation}

    Some references: