# 数学公式

Mathematical equations can be rendered using KaTeX.

## Usage​

Write inline math equations by wrapping LaTeX equations between $: Let$f\colon[a,b]\to\R$be Riemann integrable. Let$F\colon[a,b]\to\R$be$F(x)=\int_{a}^{x} f(t)\,dt$. Then$F$is continuous, and at all$x$such that$f$is continuous at$x$,$F$is differentiable at$x$with$F'(x)=f(x)$. http://localhost:3000 $f\\colon[a,b]\\to\\R$ 为一个黎曼可积的函数。 令 $F\\colon[a,b]\\to\\R$ 等于 $F(x)=\\int\_{a}^{x} f(t),dt$。 因此，$F$ 是连续的，并且对于所有使得 $f$$x$ 处连续的 $x$$F$ 都在 $x$ 处可微，并且有 $F'(x)=f(x)$. ### Blocks​ For equation block or display mode, use line breaks and $$: $$I = \int_0^{2\pi} \sin(x)\,dx$\$
http://localhost:3000
$I = \\int_0^{2\\pi} \\sin(x),dx$

## Configuration​

To enable KaTeX, you need to install remark-math and rehype-katex plugins.

npm install --save [email protected] [email protected] [email protected]

Import the plugins in docusaurus.config.js:

const math = require('remark-math');const katex = require('rehype-katex');

Add them to your content plugin or preset options (usually @docusaurus/preset-classic docs options):

remarkPlugins: [math],rehypePlugins: [katex],

Include the KaTeX CSS in your config under stylesheets:

stylesheets: [  {    href: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css',    type: 'text/css',    integrity:      'sha384-odtC+0UGzzFL/6PNoE8rX/SPcQDXBJ+uRepguP4QkPCm2LBxH3FA3y+fKSiJ+AmM',    crossorigin: 'anonymous',  },],

docusaurus.config.js
const math = require('remark-math');const katex = require('rehype-katex');module.exports = {  title: 'Docusaurus',  tagline: 'Build optimized websites quickly, focus on your content',  presets: [    [      '@docusaurus/preset-classic',      {        docs: {          path: 'docs',          remarkPlugins: [math],          rehypePlugins: [katex],        },      },    ],  ],  stylesheets: [    {      href: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css',      type: 'text/css',      integrity:        'sha384-odtC+0UGzzFL/6PNoE8rX/SPcQDXBJ+uRepguP4QkPCm2LBxH3FA3y+fKSiJ+AmM',      crossorigin: 'anonymous',    },  ],};

## Self-hosting KaTeX assets​

docusaurus.config.js
module.exports = {  stylesheets: [    {      href: '/katex/katex.min.css',      type: 'text/css',    },  ],};

The latest versions of rehype-katex (starting from v6.0.0) has moved to ES Modules, a new module system of JavaScript, which Docusaurus doesn't officially support yet. However, it is possible to import rehype-katex dynamically, using an async config creator. Docusaurus 会调用这个创造器，并等待它返回真正的配置对象。

docusaurus.config.js
async function createConfig() {  // ES Modules are imported with import() instead of require(), and are imported asynchronously  const katex = (await import('rehype-katex')).default;  return {    // ...  };}

docusaurus.config.js
const math = require('remark-math');async function createConfig() {  const katex = (await import('rehype-katex')).default;  return {    title: 'Docusaurus',    tagline: 'Build optimized websites quickly, focus on your content',    presets: [      [        '@docusaurus/preset-classic',        {          docs: {            path: 'docs',            remarkPlugins: [math],            rehypePlugins: [katex],          },        },      ],    ],    stylesheets: [      {        href: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css',        type: 'text/css',        integrity:          'sha384-MlJdn/WNKDGXveldHDdyRP1R4CTHr3FeuDNfhsLPYrq2t0UBkUdK2jyTnXPEK1NQ',        crossorigin: 'anonymous',      },    ],  };}module.exports = createConfig;