remarkjs / remark-highlight.js Goto Github PK
View Code? Open in Web Editor NEWLegacy plugin to highlight code blocks with highlight.js — please use `rehype-highlight` instead
Home Page: https://unifiedjs.com
License: MIT License
Legacy plugin to highlight code blocks with highlight.js — please use `rehype-highlight` instead
Home Page: https://unifiedjs.com
License: MIT License
I created my blog by following the nextjs.org docs. Is it because of Typescript?
Here is my code
const processedContent = await remark()
.use(highlight)
.use(html)
.process(matterResult.content);
no error, no highlighting, nothing...
I try to run basic example:
const unified = require('unified')
const markdown = require('remark-parse')
const html = require('remark-html')
const highlight = require('remark-highlight.js')
let css = `~~~css
h1 {
color: red;
}
`;
unified()
.use(markdown)
.use(highlight)
.use(html)
.process(css, (err, file) => {
console.log(String(file))
})
But output is still:
<pre><code class="language-css"> h1 {
color: red;
}
</code></pre>
so hljs classes are missing. Whats going wrong?
Testet in latest chrome.
remark-highlight.js is using an old version of lowlight and subsequently, highlight.js.
when using "resolutions" to force lowlight and highlight.js to be the latest versions, I get this error:
Must use import to load ES Module: .../node_modules/lowlight/index.js
require() of ES modules is not supported.
require() of .../node_modules/lowlight/index.js from
.../node_modules/remark-highlight.js/dist/index.js is an ES module file as it is a .js file whose nearest parent
package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename .../node_modules/lowlight/index.js to end in .cjs, change the requiring code to use import(),
or remove "type": "module" from .../node_modules/lowlight/package.json.
Lowlight is already type: module: https://github.com/wooorm/lowlight/blob/main/package.json#L28
in package.json
"resolutions": {
"highlight.js": "11.0.1",
"lowlight": "2.0.1",
}
// anywhere
require('remark-highlight.js');
Markdown does not define a syntax for language-specific inline code.
But is it possible to handle this (maybe optionally):
<code class="css">{color: red;}</code>
<code class="js">console.log("!!!")</code>
Would it be possible to add an option for unknown languages to be ignored rather than raising an error? Alternatively, could such errors be recorded in the vfile output of remark rather than throwing an error?
I am parsing a number of markdown documents that I don't have direct control of. Some of the documents contain invalid or unknown langauges in their code blocks.
Input:
```unknown
Hello, World!
```
Expected behavious: when remark-highlight.js is passed an option call something like { ignoreUnknown: true }
it ignores the unknown lanugage rather than throwing an exception.
I'm using processSync(). I've considered wrapping it in a try catch.
I'm using it in my md-content module and seems its not worked properly. It's just setted up classes but don't add highlight.js
and styles to the page, so code between these tags is not highlighted.
Maybe I’m missing something but it looks like highlight.js
isn’t actually used (just lowlight)?
Do you have any thoughts on the best way to maintain position (line, column) information in the individual leaf nodes?
Can't do live highlighting.
I'm working a project that allows user to write markdown and do a preview of it as they are writing.
To do the writing, I'm using monaco
editor, the application gets the markdown output from there and passes it down to the ReactMarkdown
like this:
<ReactMarkdown plugins={[gfm, markdownHighlight]} skipHtml={true}>
{content}
</ReactMarkdown>
So the application does live preview as the user types.
So when the user trys to write a code block, first they do '```'
and then they specify the language like this '```jsx'
.
Here where the error occurs, as soon as the user types the word j
to specify the language, the app crashes. Showing this error:
Unhandled Runtime Error
Error: Unknown language:j
is not registered
Any help on that?
Hey! Just wanted ping and request a name change from mdast to remark.
You’ve probably already seen it but here’s a list of tips for updating. And here’s a list of reasons why to update.
Let me know if I can help! 😄
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.