我正试图在标记的编辑器中获取Katex,https://github.com/markedjs/marked/issues/1538从上面的链接中获取代码,效果很好!
const marked = require('marked');
const katex = require('katex'); // external
const renderer = new marked.Renderer();
function mathsExpression(expr) {
if (expr.match(/^$$[sS]*$$$/)) {
expr = expr.substr(2, expr.length - 4);
return katex.renderToString(expr, { displayMode: true });
} else if (expr.match(/^$[sS]*$$/)) {
expr = expr.substr(1, expr.length - 2);
return katex.renderToString(expr, { isplayMode: false });
}
}
但我想将katex作为单独的模块加载,所以我尝试使用webpack中的externals:https://webpack.js.org/configuration/externals/
output: {
path: PATH(isDev),
filename: "bundle.js",
library: "BUNDLE",
libraryExport: "default",
libraryTarget: "umd",
globalObject: "this",
},
externals: {
katex: {
root: "katex",
commonjs2: "katex",
commonjs: "katex",
amd: "katex",
},
},
但是上面代码中的katex是未定义的,但它在HTML文件外部是可用的。由于我添加了katex js文件
<script
src="../katex/katex.min.js"
integrity="sha384-g7c+Jr9ZivxKLnZTDUhnkOnsh30B4H0rpLUpJ4jAIKs4fnJI+sEnkvrMWph2EDg4"
crossorigin="anonymous"
></script>
我想我错过了什么。。。你能帮我一下吗。感谢
你能试试吗:
externals: {
katex: "katex"
},
注意">katex">
拜托?
我用文件创建了一个本地演示:
-webpack.config.js
-src
--index.js
-dist
--index.html
文件:
webpack.config.js:
const path = require('path');
module.exports = {
entry: './src/index.js',
output: {
filename: 'main.js',
path: path.resolve(__dirname, 'dist'),
},
externals: {
katex: "katex"
}
};
src/index.js
var katex = require("katex");
export function foo() {
console.log(katex);
}
foo();
index.html:
<!doctype html>
<html>
<head>
<title>External Demo</title>
<script
src="../node_modules/katex/dist/katex.min.js"
></script>
</head>
<body>
<script src="main.js"></script>
</body>
</html>
控制台中的结果:{version: "0.12.0", render: ƒ, renderToString: ƒ, ParseError: ƒ, __parse: ƒ, …}
然后我可以在foo
函数中使用katex。