Comments (8)
I'm glad it's working. I'm reopening because I think we can improve things:
- Remove the dark grey box
- Activate Highlight.js syntax highlighter when
:source-highlighter:
is defined
from asciidoctor-vscode.
Asciidoctor PDF is written in Ruby and does not support Highlight.js. You can use Highlight.js when converting to HTML with Asciidoctor (Ruby) because the syntax highlighting is done client side. Asciidoctor (Ruby) also supports Rouge when converting to HTML. In this case, the syntax highlighting is done during the processing.
As mentioned above, you should use:
"asciidoc.preview.asciidoctorAttributes": {
"source-highlighter": "highlight.js"
}
You can leave :source-highlighter: rouge
in your document since it has a lower precedence. With this setting, it should use Highlight.js in the VS code preview and Rouge when converting to HTML/PDF using Asciidoctor (Ruby).
from asciidoctor-vscode.
You need to enable syntax highlighting:
:source-highlighter: highlight.js
Having said that, the grey box on top of the code block is unexpected, I will take a look 👀
from asciidoctor-vscode.
You need to enable syntax highlighting:
:source-highlighter: highlight.js
Having said that, the grey box on top of the code block is unexpected, I will take a look 👀
I do have it activated in the main.adoc
:source-highlighter: rouge
and it also works in the PDF output. It just doesn't work in the preview of VS Code.
If I'm setting this option:
"asciidoc.preview.useEditorStyle": false
Then I the black box is gone (maybe something with dark mode)?
But I'd like to see it in the preview as it would be in the final pdf.
So, with the option source-highlighter
does syntax highlighting works for you in the VS Code preview as well?
Thanks for the fast reply!
from asciidoctor-vscode.
Rouge is written in Ruby and is not available in a JavaScript environment. Only Highlight.js is compatible with Asciidoctor.js. You can use a .asciidoctorconfig
to configure Highlight.js when using VS code or add it in your settings.json:
"asciidoc.preview.asciidoctorAttributes": {
"source-highlighter": "highlight.js"
}
In theory, we could check if source-highlighter
is defined and fallback to Highlight.js in case the syntax highlighter is not available in the VS code environment.
from asciidoctor-vscode.
Ah that fixed it. Thank you so much! 😊
from asciidoctor-vscode.
Not sure if this is related to this issue. But now my syntax highlighting works in my preview but not in my generated pdf anymore with highlight.js
🤔
It doesn't work with rogue
as well. I can see it in my HTML output but not in my pdf output.
Should create a dedicated issue for that?
Setting in main.adoc
:source-highlighter: highlightjs
Any clue on what I can do here?
from asciidoctor-vscode.
Okay that works thanks!
from asciidoctor-vscode.
Related Issues (20)
- Test "Antora support with single documentation component" is flaky HOT 1
- Preview stops working if reference to bibliography entry exists in 3.2.1 HOT 5
- `npm install` reports 9 vulnerabilities on `master` HOT 1
- Quotes have a dark overlay in preview but not in .pdf HOT 4
- `package.json` and `package-lock.json` are not in sync after `prepare branch for development [no ci]` HOT 2
- Add test coverage reporting
- Project README / CHANGELOG is Markdown instead of AsciiDoc
- Asciidoc: Export Document as PDF --> prompts user every time HOT 1
- Preview scroll offset wrong when includes are used HOT 1
- Make error more prominent
- Preview scroll offset wrong when working with tables HOT 1
- Disabling SSL verification HOT 2
- Syntax highlighting broken if a variable is used with bash source
- Preview not rendering checkboxes in checklist
- Ctrl + Alt + V break HOT 1
- [Windows Only][Antora Support] `include::example$something` not working on windows
- Cant use asciidoctor in my own extension as soon as i active asciidoctor-vscode extension HOT 5
- Antora preview doesn't work if version is not specified in antora.yml
- Callout and Syntax Highlighting in code blocks
- Right-click causes incorrect multi-select behavior HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from asciidoctor-vscode.