客服电话
APP下载
迪恩网络APP
随时随地掌握行业动态
官方微信
扫描二维码
关注迪恩网络微信公众号
开源软件名称（OpenSource Name）：susam/texme开源软件地址(OpenSource Url)：https://github.com/susam/texme开源编程语言(OpenSource Language)：JavaScript 95.2%开源软件介绍(OpenSource Introduction)：TeXMeTeXMe is a lightweight JavaScript utility to create self-rendering Markdown + LaTeX documents.
Contents
Get StartedCopy and paste the code below into an HTML file with <!DOCTYPE html><script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$This file contains one line of HTML code followed by Markdown + LaTeX content. Open this HTML file with a web browser. It renders itself to look like this: get-started.html. Here is a screenshot of the output: There are three simple rules to remember while using TeXMe:
If you do not like to start your document with HTML tags, you can write
your content first and add the CDN URLsUse the following URL in the Use the following URL in the If you need something really easy to remember, use this URL to load the latest version of TeXMe: Valid HTML5The Get Started section earlier shows how we can create
a self-rendering document with a single line of HTML code but this
brevity comes at the cost of standard conformance. For example, the
required For the sake of completeness and correctness, here is a minimal but complete and valid HTML5 example: <!DOCTYPE html>
<html lang="en">
<title>Notes on Euler's Identity</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$
</textarea>Here is the output: valid-html5.html. It has a few more lines of code to ensure that this HTML5 code validates successfully at validator.w3.org. As a result, this example does not look as concise as the one in the previous section. In case you are wondering, a valid HTML5 document does not require
explicit In practice though, it is not necessary to write verbose code like this. All browsers follow the robustness principle, so they can render the shorter example in the Get Started section just fine. Use TeXMe in Web PagesStyleTeXMe renders the document on a white pane against a gray background by
default. This is due to a configuration option named To render the document with a minimal style on a completely plain white
background, set the <!DOCTYPE html>
<script>window.texme = { style: 'plain' }</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$Here is the output: style-plain.html. To render the document with absolutely no style, set <!DOCTYPE html>
<script>window.texme = { style: 'none' }</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<style>
body {
background: lightcyan;
}
main {
max-width: 20em;
padding: 1em;
border: medium double gray;
margin: 2em auto;
background: lightyellow;
}
</style>
<textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$Here is the output: style-custom.html. Note that the rendered content is displayed within a Render Markdown Without MathJaxTo render Markdown-only content without any mathematical content at all,
set <!DOCTYPE html>
<script>window.texme = { useMathJax: false, protectMath: false }</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Atomic Theory
**Atomic theory** is a scientific theory of the nature of matter, which
states that matter is composed of discrete units called *atoms*. It
began as a philosophical concept in ancient Greece and entered the
scientific mainstream in the early 19th century when discoveries in the
field of chemistry showed that matter did indeed behave as if it were
made up of atoms.Here is the output: markdown-only.html. Skip Automatic Rendering on LoadWhen TeXMe loads, it begins rendering the document automatically. This
automatic rendering may be skipped by setting <!DOCTYPE html>
<script>window.texme = { renderOnLoad: false }</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script>
window.onload = function () {
var button = document.getElementById('button')
button.onclick = function () {
button.remove()
texme.renderPage()
}
}
</script>
<textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$
</textarea>
<div><button id="button">Render</button></div>Here is the output: skip-render.html. Set Options After LoadingWhen we load TeXMe with the However if we set the Here is an example that skips automatic rendering on load and sets the
style to <!DOCTYPE html>
<script>window.texme = { renderOnLoad: false }</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script>
window.onload = function () {
var button = document.getElementById('button')
button.onclick = function () {
button.remove()
texme.setOption('style', 'plain')
texme.renderPage()
}
}
</script>
<textarea>
# Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$
</textarea>
<div><button id="button">Render</button></div>Here is the output: set-options.html. Content in BodyIf you do not like to start your document with HTML tags, you can
write your content first and add the # Euler's Identity
In mathematics, **Euler's identity** is the equality
$$ e^{i \pi} + 1 = 0. $$
## Explanation
Euler's identity is a special case of Euler's formula from complex
analysis, which states that for any real number $ x $,
$$ e^{ix} = \cos x + i \sin x. $$
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>Here is the output: content-in-body.html. Although, the code looks neater in this example, there is a limitation
associated with this form of writing content: Since the content is part
of the HTML CaveatsWhile using the content-in-body method of using TeXMe, an HTML syntax
error in the content can produced mangled output. For example, the
following input is not rendered as expected because the content is in
the Here is some unusual code:
```
print('unusual <string')
```
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>Here is the broken output: unusual-code-body.html. The <string') ```="" <script="" src="https://cdn.jsdelivr.net/npm/[email protected]">This mangled form of the input is then rendered leading to unexpected
results. To resolve this, put the content within a <!DOCTYPE html><script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
Here is some unusual code:
```
print('unusual <string')
```Here is the output: unusual-code-textarea.html. Since the content occurs within the Use TeXMe as a LibraryThe examples so far use TeXMe as a utility. The previous examples load
TeXMe in a web page and then TeXMe automatically picks the In this section, we see how to use TeXMe as a library and invoke its functions. These examples would run as is on Node.js. Install TeXMeEnter the following command to install TeXMe: npm install texmeRender Markdown and LaTeXMarkdown + LaTeX content can be rendered to HTML by simply invoking the
var texme = require('texme')
var input = '**Foo** $$ {a}_{1} {a}_{2} $$'
var output = texme.render(input)
console.log(output)The above example produces the following output: <p><strong>Foo</strong> $$ {a}_{1} {a}_{2} $$</p>Configuration OptionsHere is a quick reference for all the supported configuration options:
Self-Hosting TeXMeSome users of TeXMe want to know if TeXMe can be hosted on one's own web server such that TeXMe does not load resources from any other web server while rendering a document, i.e., any requests to load resources must be made to the same web server from which TeXMe is loaded. Yes, it is possible to self-host TeXMe in this manner. Here are the steps:
Markdown Priority EnvironmentTeXMe provides a special LaTeX-like environment named TeXMe introduces the special purpose Protect Dollar Sign in CodeThe <!DOCTYPE html><script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Using Variables
To expand a variable in shell script, prefix the variable name with a
dollar sign. For example:
```
foo=hello
echo $foo
```
The variable `$foo` is substituted with its value, if any, after the
expansion. In the above example, `$foo` expands to the string `hello`,
so the output looks like this:
```
hello
```The above code fails to render as expected because the TeXMe tokenizer
parses out everything between A rendering issue like this can be prevented with the use of the markdown priority environment like this: <!DOCTYPE html><script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Using Variables
To expand a variable in shell script, prefix the variable name with a
dollar sign. For example:
\begin{md}
```
foo=hello
echo $foo
```
\end{md}
The variable \begin{md}`$foo`\end{md} is substituted with its value, if
any, after the expansion. In the above example, \begin{md}`$foo`\end{md}
expands to `hello`, so the output looks like this:
```
hello
```The Protect Dollar Sign in Image DescriptionHere is another example that shows how rendering can break when LaTeX
delimiter is found in a Markdown element such as within image
description and how the usage of the <!DOCTYPE html><script src="https://cdn.jsdelivr.net/npm/[email protected]"></script><textarea>
# Metasyntactic Variable
![Screenshot of variable $foo assigned and echoed in shell][1]
The screenshot above shows an example usage of a metasyntactic variable
`$foo` in an interactive shell session.
[1]: https://i.imgur.com/iQx46hd.pngThe above input fails to render as expected because the TeXMe tokenizer
parses out everything between the first occurrence of The 全部评论
专题导读
上一篇：altercation/ethanschoonover.com-OLD: website source (hakyll, pandoc markdown)发布时间：2022-08-18下一篇：styledown/styledown: Markdown-based styleguide generator发布时间：2022-08-18热门推荐
热门话题
 阅读排行榜
|
请发表评论