问题标签 [prismjs]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 使用 ngx-prism 突出显示 JS 语法
我想在我的网站上显示一些代码并突出显示语法，以便它更具可读性。我基本上想为此使用一些库，所以我找到了这个 ngx-prism。我遵循其文档中的每一步，即：
我运行这两个命令：
npm i --save @ngx-prism/corenpm i --save @types/prismjs@1.9.0 prismjs@1.9.0
我将 PrismModule 导入我的 app.module 并将其添加到导入数组
然后在我的一个组件中，我尝试使用它：
我没有任何错误，但突出显示不起作用..它看起来像裸<code>标签：
我用ng serve --aot.
我做错了什么还是这个库坏了？如果是这样的话，你能分享我一些替代方案吗？
html - 有人可以解释我在尝试为我的网站创建语法突出显示时做错了什么吗？
我正在努力为我的个人网站添加语法突出显示，我会在其中参考我学到的概念。
起初，为了记录我的笔记，我使用 Markdown，因为它很容易记笔记。但是随着我越来越多的探索，我发现我想要的东西比 Markdown 所能做的要多得多，并意识到我想做我自己的网站。
本质上，我使用 pandoc 将我非常大的 .md 文件转换为 .html，我认为我或多或少地留下了一团糟。当然没有 CSS，有一段时间我真的四处寻找如何使 html 看起来很棒。我想我会从我的代码片段的语法高亮开始，这些代码片段被转换为：
所以至少看起来 pandoc 理解我在 markdown 中编写代码，因为我们有<code class="lang-c">（虽然它看起来仍然很丑，但我不知道发生了一半的事情）。
然后我看到了这个博客： https ://www.taniarascia.com/adding-syntax-highlighting-to-code-snippets/ 并按照一些说明执行以下操作：
在哪里new.css：https ://github.com/taniarascia/new-moon/blob/master/docs/css/main.css
但现在一切似乎都一团糟，并不美好。最明显的是，我的代码根本没有突出显示语法：
我该怎么做才能使我的网站漂亮？老实说，我有点盲目地遵循我在互联网上找到的建议，这可能不是最有成效的，但我不知道在哪里可以学习这种东西。
PS。如果相关，我会使用 Vim。
编辑：是的，我在 body: 结束之前也有来自 prism 的 js 文件<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.0/prism.min.js"></script>。
编辑 2：如果您想尝试重新创建问题，这是一个最小的示例（请记住 new.css 是我从https://github.com/taniarascia/new-moon/blob/master/docs/css/main 下载的。 ) _
javascript - 如何在 Svelte 组件中运行 Prismjs？
我只是想在我的 Svelte 项目中实现 Prismjs。
我正在加载 CSS<head>并在我的 Svelte 组件中导入 JS。
我遇到了这里描述的类似问题：https ://medium.com/get-it-working/get-prismjs-working-in-react-a6d989e59290
基本上，似乎我需要在组件渲染后重新运行脚本。我试图通过在生命周期Prism.highlightAll()内运行，以与文章中 React 中描述的方式相同的方式完成此操作onMount。
我希望这种方法能奏效，但我一无所获。我仍然需要刷新页面才能看到样式生效。我在这里想念什么？
node.js - 使用 prismjs 生成静态 html - 如何启用行号？
我正在使用 node.js 从代码中生成静态html 文件，并使用 prismjs 对其进行格式化。在我的应用程序中，我无法访问支持 Javascript 的 HTML 渲染器（我使用的是“htmllite”）。所以我需要能够生成不需要 Javascript 的 HTML。
这很好用。但我想使用该line-numbers插件，但不知道如何使它工作。我<pre>的line-numbers班级，我的左边距更大，但没有行号。
visual-studio-code - 文件类型/语言映射的文件扩展名数据库
vscode 为语言映射的文件扩展名使用了一个很好的模式：
https://code.visualstudio.com/docs/languages/identifiers
prismjs 等工具内置了对数百种语言的支持。
但是我在任何地方都找不到语言映射的通用扩展数据库。注意我不关心 mime 类型。在我的情况下，我想要一个内置的（实际上，最好是从 webapi 驱动）映射集。
我搜索了 vscode 并找到了处理它处理的映射的代码（/src/vs/editor/common/services/languagesRegistry.ts），但它似乎从已安装的扩展加载映射。
IOW，我想使用上述模式生成（或查找！）一个 JSON 文档，其中包含 prismjs 支持的所有 199 种语言。
有什么建议么？
javascript - 如何将博客文章的代码示例存储在mongoDB中并保持缩进和换行？
我正在构建一个技术博客，其中包含使用 Angular、Node.js 和 MongoDB 的文章中的代码示例，我将帖子正文存储为 html 格式。当我存储帖子时，代码片段缩进和换行符被空格替换。我找不到一种方法来存储它们并以我想要的方式显示它们。
期望
我得到了什么
顺便说一句，我使用 Prism.js 作为语法荧光笔。
prismjs - 为什么使用 PrismJS 的 npm 项目中没有突出显示某些语言？
我在一个 npm 项目中使用Spectacle 5，该项目本身使用 Prism 作为依赖项。CodePane组件正确突出了 eg 的代码，python但 eghaskell没有突出显示（我验证了相同的代码片段在https://prismjs.com/test.html#language=haskell工作）。
我在 Web 控制台中没有看到任何表明存在问题的错误。我想知道我是否还需要手动包含 CSS，或者这可能是 Spectacle 的问题。也许一种解决方法是尝试使用诸如prism 组件加载器之类的东西？据我所知，npm 没有针对个别语言的组件，似乎暗示默认是加载所有语言组件。
angular - Angular 中的 Prism.js 适用于第一个代码块（代码语法突出显示）
安装以下包后
然后我创建了一个名为：HighlightService
我在组件中使用了上面的服务，如下所示：
最后，在 style.scss 的顶部添加以下 SCSS：
我的问题是上述服务适用于页面中的第一个代码块！
reactjs - 带有 React 的 PrismJS：使用 babel-plugin-prismjs
我最近决定将 PrismJS 与 React 一起使用，为了避免重复导入，我设法使用这个 babel-plugin-prismjs 包来加载插件、语言等。
如插件文档中所示，我在根文件夹中创建了一个 .babelrc 文件：
但我发现这个文件似乎被忽略了，因为没有加载任何内容，并且在控制台记录我导入的 Prism 对象时，我只看到默认语言的语法突出显示。
我想要获得语法突出显示的文件有一个import Prism from 'prismjs'语句和Prism.highlightAll()
所以是的，我可以继续在我的每个文件中手动导入插件、主题和语言，但我想找出出现此类问题的原因。
谢谢 ！
javascript - Prism.js 仅在开始行时突出显示
我正在为 Prism.js 编写自定义语言扩展，但在突出显示注释时遇到问题。我想突出显示以#or//开头并从行首开始的注释：
这是我用来检测评论的模式/(^|[^\\])[#\/\/].*/：
不幸的是，它没有按预期工作：
我尝试使用lookbehindandgreedy选项（docs），但没有帮助。