patrick/KaTeX
1
0
Fork 0
mirror of https://github.com/Smaug123/KaTeX synced 2025-10-04 18:58:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enable hot module replacement(HMR) (#1100)

Browse Source 
* Use ES6 in static/main.js

+ Lint static/main.js

* Enable hot module replacement(HMR) in webpack-dev-server

* Disable no-console in static/main.js

* Use seperate entry point/bundle for the test page(/static/main.js)
This commit is contained in:
ylemkimon
2018-02-02 03:33:49 +09:00
committed by Kevin Barabash
parent 603f12df8d
commit 30854eb866
5 changed files with 39 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
package.json
View File

@@ -55,7 +55,7 @@
},
"bin": "cli.js",
"scripts": {
"lint": "eslint katex.js katex.webpack.js cli.js webpack.common.js webpack.config.js webpack.dev.js src test contrib dockers && stylelint src/katex.less",
"lint": "eslint katex.js katex.webpack.js cli.js webpack.common.js webpack.config.js webpack.dev.js src static test contrib dockers && stylelint src/katex.less",
"flow": "flow",
"jest": "jest",
"jest-update": "jest --updateSnapshot",
@@ -64,7 +64,7 @@
"clean-install": "npm run clean && npm i",
"test": "check-dependencies && npm run lint && npm run flow && npm run jest",
"verify-screenshots": "check-dependencies && dockers/Screenshotter/screenshotter.sh --verify",
"start": "check-dependencies && webpack-dev-server --config webpack.dev.js",
"start": "check-dependencies && webpack-dev-server --hot --config webpack.dev.js",
"build": "check-dependencies && rimraf build/* && webpack",
"watch": "npm run build -- --watch",
"perf-test": "check-dependencies && NODE_ENV=test node test/perf-test.js",

4
static/index.html
View File

@@ -3,8 +3,7 @@
<head>
<meta charset="UTF-8">
<title>KaTeX Test</title>
<script src="katex.js" type="text/javascript"></script>
<link href="main.css" rel="stylesheet" type="text/css">
<script defer src="/main.js" type="text/javascript"></script>
</head>
<body>
<textarea id="input" rows="5">
@@ -14,6 +13,5 @@
</textarea>
<div id="math"></div>
<input id="permalink" type="button" value="permalink">
<script src="main.js" type="text/javascript"></script>
</body>
</html>

54
static/main.js
View File

@@ -1,31 +1,29 @@
/* eslint no-console:0 */
/**
* This is the webpack entry point for the test page.
*/
import katex from '../katex.webpack.js';
import './main.css';
function init() {
var input = document.getElementById("input");
var math = document.getElementById("math");
var permalink = document.getElementById("permalink");
const input = document.getElementById("input");
let math = document.getElementById("math");
const permalink = document.getElementById("permalink");
if ("oninput" in input) {
input.addEventListener("input", reprocess, false);
} else if (input.attachEvent) {
input.attachEvent("onkeyup", reprocess);
}
input.addEventListener("input", reprocess, false);
permalink.addEventListener("click", setSearch);
if ("addEventListener" in permalink) {
permalink.addEventListener("click", setSearch);
} else {
permalink.attachEvent("click", setSearch);
}
var match = (/(?:^\?|&)text=([^&]*)/).exec(window.location.search);
let match = (/(?:^\?|&)text=([^&]*)/).exec(window.location.search);
if (match) {
input.value = decodeURIComponent(match[1]);
}
var macros = {};
const macros = {};
// TODO: Add toggle for displayMode.
// https://github.com/Khan/KaTeX/issues/1035
var options = {displayMode: true};
var macroRegex = /(?:^\?|&)(?:\\|%5[Cc])([A-Za-z]+)=([^&]*)/g;
var macroString = "";
const options = {displayMode: true};
const macroRegex = /(?:^\?|&)(?:\\|%5[Cc])([A-Za-z]+)=([^&]*)/g;
let macroString = "";
while ((match = macroRegex.exec(window.location.search)) !== null) {
options.macros = macros;
macros["\\" + match[1]] = decodeURIComponent(match[2]);
@@ -36,12 +34,12 @@ function init() {
// The `after` search parameter puts normal text after the math.
// Example use: testing baseline alignment.
if (/(?:^\?|&)(?:before|after)=/.test(window.location.search)) {
var mathContainer = math;
const mathContainer = math;
mathContainer.id = "math-container";
if ((match = /(?:^\?|&)before=([^&]*)/.exec(window.location.search))) {
var child = document.createTextNode(decodeURIComponent(match[1]));
mathContainer.appendChild(child);
const before = document.createTextNode(decodeURIComponent(match[1]));
mathContainer.appendChild(before);
macroString += "&" + match[0].substr(1);
}
@@ -50,8 +48,8 @@ function init() {
mathContainer.appendChild(math);
if ((match = /(?:^\?|&)after=([^&]*)/.exec(window.location.search))) {
var child = document.createTextNode(decodeURIComponent(match[1]));
mathContainer.appendChild(child);
const after = document.createTextNode(decodeURIComponent(match[1]));
mathContainer.appendChild(after);
macroString += "&" + match[0].substr(1);
}
}
@@ -67,13 +65,19 @@ function init() {
try {
katex.render(input.value, math, options);
} catch (e) {
if (e.__proto__ == katex.ParseError.prototype) {
if (e.__proto__ === katex.ParseError.prototype) {
console.error(e);
} else {
throw e;
}
}
}
if (module.hot) {
module.hot.accept('../katex.webpack.js', reprocess);
}
}
init();
export default katex;

1
webpack.common.js
View File

@@ -99,6 +99,7 @@ function createConfig(target /*: Target */, dev /*: boolean */,
new webpack.EnvironmentPlugin({
NODE_ENV: dev ? 'development' : 'production',
}),
dev && new webpack.NamedModulesPlugin(),
minimize && new UglifyJsPlugin({
uglifyOptions: {
output: {

8
webpack.dev.js
View File

@@ -3,10 +3,14 @@ const { targets, createConfig } = require('./webpack.common');
const path = require('path');
const PORT = 7936;
// only the `devServer` options for the first configuration will be taken
// into account and used for all the configurations in the array.
// dev minify
const katexConfig = createConfig(targets.shift(), true, false);
// add the entry point for test page
katexConfig.entry.main = './static/main.js';
// only the `devServer` options for the first configuration will be taken
// into account and used for all the configurations in the array.
katexConfig.devServer = {
contentBase: [path.join(__dirname, 'static'), __dirname],
// Allow server to be accessed from anywhere, which is useful for