added katex.js and load it via webpack
This commit is contained in:
parent
16de14ea98
commit
ad9e3dfe5d
|
@ -1,4 +1,5 @@
|
|||
/* global katex */
|
||||
// import katex from 'katex';
|
||||
import Flash from './flash';
|
||||
|
||||
// Renders math using KaTeX in any element with the
|
||||
// `js-render-math` class
|
||||
|
@ -7,11 +8,9 @@
|
|||
//
|
||||
// <code class="js-render-math"></div>
|
||||
//
|
||||
// Only load once
|
||||
let katexLoaded = false;
|
||||
|
||||
// Loop over all math elements and render math
|
||||
function renderWithKaTeX(elements) {
|
||||
function renderWithKaTeX(elements, katex) {
|
||||
elements.each(function katexElementsLoop() {
|
||||
const mathNode = $('<span></span>');
|
||||
const $this = $(this);
|
||||
|
@ -30,9 +29,7 @@ function renderWithKaTeX(elements) {
|
|||
export default function renderMath($els) {
|
||||
if (!$els.length) return;
|
||||
|
||||
if (katexLoaded) {
|
||||
renderWithKaTeX($els);
|
||||
} else {
|
||||
import(/* webpackChunkName: 'katex' */ 'katex').then((katex) => {
|
||||
$.get(gon.katex_css_url, () => {
|
||||
const css = $('<link>', {
|
||||
rel: 'stylesheet',
|
||||
|
@ -40,12 +37,9 @@ export default function renderMath($els) {
|
|||
href: gon.katex_css_url,
|
||||
});
|
||||
css.appendTo('head');
|
||||
|
||||
// Load KaTeX js
|
||||
$.getScript(gon.katex_js_url, () => {
|
||||
katexLoaded = true;
|
||||
renderWithKaTeX($els); // Run KaTeX
|
||||
});
|
||||
renderWithKaTeX($els, katex);
|
||||
});
|
||||
}
|
||||
}).catch((err) => {
|
||||
Flash(`Can't load katex module: ${err}`);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -15,7 +15,6 @@ module Gitlab
|
|||
gon.shortcuts_path = help_page_path('shortcuts')
|
||||
gon.user_color_scheme = Gitlab::ColorSchemes.for_user(current_user).css_class
|
||||
gon.katex_css_url = ActionController::Base.helpers.asset_path('katex.css')
|
||||
gon.katex_js_url = ActionController::Base.helpers.asset_path('katex.js')
|
||||
gon.sentry_dsn = current_application_settings.clientside_sentry_dsn if current_application_settings.clientside_sentry_enabled
|
||||
gon.gitlab_url = Gitlab.config.gitlab.url
|
||||
gon.revision = Gitlab::REVISION
|
||||
|
|
|
@ -56,6 +56,7 @@
|
|||
"js-cookie": "^2.1.3",
|
||||
"jszip": "^3.1.3",
|
||||
"jszip-utils": "^0.0.2",
|
||||
"katex": "^0.9.0-alpha2",
|
||||
"marked": "^0.3.6",
|
||||
"monaco-editor": "0.10.0",
|
||||
"mousetrap": "^1.4.6",
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import Vue from 'vue';
|
||||
import MarkdownComponent from '~/notebook/cells/markdown.vue';
|
||||
import katex from 'vendor/katex';
|
||||
import katex from 'katex';
|
||||
|
||||
const Component = Vue.extend(MarkdownComponent);
|
||||
|
||||
|
|
File diff suppressed because it is too large
Load Diff
10
yarn.lock
10
yarn.lock
|
@ -3872,6 +3872,12 @@ karma@^1.7.0:
|
|||
tmp "0.0.31"
|
||||
useragent "^2.1.12"
|
||||
|
||||
katex@^0.9.0-alpha2:
|
||||
version "0.9.0-alpha2"
|
||||
resolved "https://registry.yarnpkg.com/katex/-/katex-0.9.0-alpha2.tgz#f559e8bb32969082d735d949960b7df133fd5831"
|
||||
dependencies:
|
||||
match-at "^0.1.1"
|
||||
|
||||
kind-of@^3.0.2:
|
||||
version "3.1.0"
|
||||
resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.1.0.tgz#475d698a5e49ff5e53d14e3e732429dc8bf4cf47"
|
||||
|
@ -4166,6 +4172,10 @@ marked@^0.3.6:
|
|||
version "0.3.6"
|
||||
resolved "https://registry.yarnpkg.com/marked/-/marked-0.3.6.tgz#b2c6c618fccece4ef86c4fc6cb8a7cbf5aeda8d7"
|
||||
|
||||
match-at@^0.1.1:
|
||||
version "0.1.1"
|
||||
resolved "https://registry.yarnpkg.com/match-at/-/match-at-0.1.1.tgz#25d040d291777704d5e6556bbb79230ec2de0540"
|
||||
|
||||
math-expression-evaluator@^1.2.14:
|
||||
version "1.2.16"
|
||||
resolved "https://registry.yarnpkg.com/math-expression-evaluator/-/math-expression-evaluator-1.2.16.tgz#b357fa1ca9faefb8e48d10c14ef2bcb2d9f0a7c9"
|
||||
|
|
Loading…
Reference in New Issue