javascript - 带有 npm 的客户端 Prism.js

我正在尝试使用 Prism.js 语法荧光笔客户端作为 npm 依赖项，而不是从 0x25181223134314 标签加载它这是 package.json 中的 Prism 引用

{
    "dependencies": {
        "prismjs": "^1.5.1"
    }
}

以及我尝试在代码中使用它的方式

import Prism from 'prismjs'
Prism.highlightAll();

这会产生以下结果:

基本语言(html、javascript...)的标记化工作

Tokenizing 不适用于其他特定语言(lua、handlebars...)

对于所有语言，不应用语法着色(css 文件似乎没有加载)

所以我想知道

是否还有其他特定于语言的软件包(例如prismjs-handlebars)？

是否有特定主题的包(例如prism-okaidia)可以导入css？

——

TL；DR

如何从 <script src="..."> 而不是脚本标签加载/使用 Prism.js 客户端？

最佳答案

我最终找到了做到这一点的方法。

1. 将 style-loader 和 css-loader 添加到 package.json

{
    "dependencies": {
        "style-loader": "^0.13.1",
        "css-loader": "^0.23.0",
        "prismjs": "^1.5.1"
    }
}

2.加载css文件在webpack.config.js

module: {
    loaders: [
        {
            test: /\.css/,
            loader: 'style-loader!css-loader'
        }
    ]
}

3. 在应用程序中导入所需文件

import Prism from 'prismjs'
import 'prismjs/themes/prism-okaidia.css'
import 'prismjs/components/prism-handlebars.min.js'
import 'prismjs/components/prism-lua.min.js'

Prism.highlightAll();

关于javascript - 带有 npm 的客户端 Prism.js，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37678055/