Markdown code block highlight consistency - what is "s" alias - visual-studio-code
The built-in markdown editor has a "live-preview" for code blocks without open a side previewer.
I was looking for a list of supported language highlight, which as I understand is defined by highlight.js supported language.
I need to add some "ssh config files" in my markdown, but
when I use properties language tag, only side previewer shows the highlight, not the editor itself
when I try with a weird "s" language alias, the editor can detect the comments and non-alphabetic characters. But the side previewer shows nothing...
VSCode screenshot:
My questions:
"s" is not defined as an alias in highlight.js, then how come the editor can detect the language?
Why the editor and previewer do not have the same highlight behavior?
I prefer to have the correct highlight in editor, which language/alias should I use in place of "properties"?
Summarizing previous comments and answers here:
VScode markdown "in-editor" code highlight use "markdown-basic" extension, with a list of supported languages in this file
The "alias" for different languages are "hidden" in the regex of each block definition. for example for R language the alias is R|r|s|S|Rprofile|\\{\\.r.+?\\}. (I extract a complete list of aliases from the source codes and it is shown below)
More specifically for what I want, i.e. key-value pair config file equivalent to properties in highlight.js, there is no exact the same in "markdown-basic", so I will use conf.
Developer: Inspect Editor Tokens and Scopes helps a lot when you see a unfamiliar alias and want to know what it is
List of code block languages aliases for "markdown-basic":
bat|batch
bibtex
c|h
clj|cljs|clojure
coffee|Cakefile|coffee.erb
COMMIT_EDITMSG|MERGE_MSG
cpp|c\\+\\+|cxx
cs|csharp|c#
css|css.erb
dart
dockerfile|Dockerfile
elixir
erlang
fs|fsharp|f#
git-rebase-todo
go|golang
groovy|gvy
handlebars|hbs
html|htm|shtml|xhtml|inc|tmpl|tpl
ini|conf
jade|pug
java|bsh
js|jsx|javascript|es6|mjs|cjs|\\{\\.js.+?\\}
json|json5|sublime-settings|sublime-menu|sublime-keymap|sublime-mousemap|sublime-theme|sublime-build|sublime-project|sublime-completions
jsonc
latex|tex
less
log
lua
Makefile|makefile|GNUmakefile|OCamlMakefile
markdown|md
objectivec|objective-c|mm|objc|obj-c|m|h
patch|diff|rej
perl|pl|pm|pod|t|PL|psgi|vcl
perl6|p6|pl6|pm6|nqp
php|php3|php4|php5|phpt|phtml|aw|ctp
powershell|ps1|psm1|psd1
python|py|py3|rpy|pyw|cpy|SConstruct|Sconstruct|sconstruct|SConscript|gyp|gypi|\\{\\.python.+?\\}
R|r|s|S|Rprofile|\\{\\.r.+?\\}
re
regexp
ruby|rb|rbx|rjs|Rakefile|rake|cgi|fcgi|gemspec|irbrc|Capfile|ru|prawn|Cheffile|Gemfile|Guardfile|Hobofile|Vagrantfile|Appraisals|Rantfile|Berksfile|Berksfile.lock|Thorfile|Puppetfile
rust|rs|\\{\\.rust.+?\\}
scala|sbt
scss
shell|sh|bash|zsh|bashrc|bash_profile|bash_login|profile|bash_logout|.textmate_init|\\{\\.bash.+?\\}
sql|ddl|dml
swift
tsx
typescript|ts
vb
xml|xsd|tld|jsp|pt|cpt|dtml|rss|opml
xsl|xslt
yaml|yml
I don't believe VSCode's native syntax highlighting has anything to do with highlight.js. It is provided by language-specific extensions, some of which ship with the editor.
In this case, VSCode is using its built-in R mode for that code block. You can see the language being used via Developer: Inspect Editor Tokens and Scopes in the command palette. R is an open-source implementation of the language S, so this makes sense.
The Markdown preview, on the other hand, may well use highlight.js and you are right that s is meaningless there.
I don't see a good language code to use in your code fence, but will update this answer if I find one.
Related
Variable name autocomplete for VSCode Language Extension (GameMaker / GML files)?
I'm editing GML files (GameMaker Studio) in VSCode. There's a wonderful plugin, GML Support which adds autocomplete for inbuilt GML functions and instances variables along with a bunch of other cool things. However, VSCode doesn't seem to recognise local variables in GML (see screen grab below. Dot notation works fine) I had a look at the VSCode's Programmatic Language Extension for variable name auto-completion but still don't get how I could register the variable declaration (i.e. var fooBar = 23;) with VSCode's Language Server. Ideally, I'd like the Language Server to respect variable scope for GML files: global variables - any var declarations for files under script folder any local variable declarations - all var declarations in the surrounding {...} What would be the easiest way to add variable name completion as described above? Thanks in advance! Edit: looked at vscode-python to see how registerCompletionItemProvider (based on VSCode Language Extension doco) could be used. Unfortunately, still not clear to me as vscode-python seem to rely on Jedi to provide symbols? So any points appreciated!
If you want to enable simple auto-completion, you can add the following to your settings.json (Command Palette ➜ Open Settings (JSON)): "[gml-gms81]": { "editor.quickSuggestions": true }, "[gml-gms1]": { "editor.quickSuggestions": true }, "[gml-gms2]": { "editor.quickSuggestions": true }, which works for a workaround: For a proper solution, well, you'll need to use the registerCompletionItemProvider and index the file on demand or as you go. The official example demonstrates the use. For intricacies of processing GML syntax, you can peck at the code in the Ace-based external editor that I made. Processing variable definitions specifically requires you to skip over strings, comments, and loop over values (var name[=value][, name2[=value2]]) with relative degree of confidence (which can be accomplished through a balanced parser).
Sublime Text 3: Auto-Complete uses incorrect syntax for for loop
With sublime text 3, the autocomplete when typing "for" and hitting tab gives you: for x in xrange(1,10): pass However, this is not a valid statement for python 3. I've tried creating a new build system using the following: { "cmd": ["c:/Python37/python.exe", "-u", "$file"], "file_regex": "^[ ]*File \"(...*?)\", line ([0-9]*)", "selector": "source.python" } the auto-complete for for still gives the wrong syntax. any advice?
The short version is that the sublime-build and sublime-snippet files that ship with Sublime in support of Python target Python version 2 and not Python version 3. I don't know if that's just due to that being what was used initially or if it's being done on purpose, though. In Sublime, resources are generally related to a particular language based on the scope provided by the syntax definition. So for example snippets for Python are associated with source.python, your example build file uses that scope to know that it applies to Python files, and so on. As such, no matter what build you happen to be using, that has no effect on the snippets that are being offered. By way of example, if you use the View Package File command from the command palette and enter the text python for snippet, the list of package resources will filter to Python/Snippets/for.sublime-snippet; pressing Enter to view that resource shows this: <snippet> <tabTrigger>for</tabTrigger> <scope>source.python</scope> <description>For Loop</description> <content><![CDATA[ for ${1:x} in ${2:xrange(1,10)}: ${0:pass} ]]></content> </snippet> Here the tabTrigger specifies how the snippet inserts, scope controls where it inserts and content controls what it is inserts. Thus, in order to change it to support Python 3, you need to either create your own snippet or modify the existing one. An issue with creating your own snippet is that it will be added to the list of snippets including the offending one, which allows it to possibly still trigger when you don't expect it to. There is also no general purposes "easy" way to disable individual snippets. As such, generally the best course of action would be to use the PackageResourceViewer package. Install it, select PackageResourceViewer: Open Resource from the command palette, then select the same file as outlined above and modify the content of the snippet (e.g. replace xrange with range) and save the file. That will get Sublime to replace the existing snippet with your edited version, so that it takes the place of the existing one and works the way you want.
How do I stop Notepad++ from showing autocomplete for all words in the file
I'm trying to use Notepad++ with the Progress programming language. I have installed the language definition in %APPDATA%\Roaming\Notepad++ as userDefineLang.xml and syntax highlighting is working correctly. I've put a file in the notepad++ Plugins\APIs directory named progress.xml, but the contents are not recognized by Notepad++. I've also removed all the other language files from that directory and Notepad++ still shows the exact same autocomplete suggestions it did before I removed them. Also, when typing in a program, it looks like every word in the file is an auto-complete suggestion, not just the keywords or function names. Anyone know how to track this down?
Notepad++ provides 2 types of features: Auto-completion that read the open file and provide suggestion of words and/or functions within the file Suggestion with the arguments of functions (specific to the language) Based on what you write, it seems what you want is auto-completion on function only + suggestion on arguments. To do that, you just need to change a setting. Go to Settings > Preferences... > Auto-completion Check Enable Auto-completion on each input Select Function completion and not Word completion Check Function parameter hint on input (if you have this option) On version 6.5.5 of Notepad++, I have this setting Some documentation about auto-completion is available in Notepad++ Wiki.
The answer is to DISABLE "Enable auto-completion on each input". Tested and works perfectly.
Shortcut for "code block" macro in Confluence editor
We use confluence for documentaion but i find very time consuming to select the code macro; it's a 5 step process. Even typing the macro by hand is not efficient. In the Stack Overflow editor all we have to do is select the text and press a button or hit ctrlK, and the text is formatted as code. Is there a way to do this in Confluence?
even typing by hand is also not efficient I use the code macro extensively and always use the autocomplete feature by typing { and choosing 'Code Macro' from the list (It's enough to type co for the code macro). This is a very efficient. Of course a keyboard shortcut would be faster, but there is no shortcut for the code macro. (AFAIK there is no keyboard shortcut for a specific macro at all)
I use Ctrl-Shift-D then wrap the text in {code}. This also fixes the problem with formatting being stripped from pasted text. In Confluence 5.x if you edit a page, you can type {cod<enter} and it puts a Code Block box on the page, but when code is pasted into this box it can strip out end of line characters. Open the Insert Markup window using Ctrl-Shift-D Paste in your code as plain text This way the formatting is not stripped out. Add {code} tags.
You can also type three back ticks ``` to create a code block as you would in vanilla Markdown. This creates an empty code block very quickly. I never have with problems with formatting when pasting code in this way. The one irritating feature of this method is that you can't specify the language as you do in Markdown, you have to select the language from a list.
How do you display code snippets in MS Word preserving format and syntax highlighting?
Does anyone know a way to display code in Microsoft Word documents that preserves coloring and formatting? Preferably, the method would also be unobtrusive and easy to update. I have tried to include code as regular text which looks awful and gets in the way when editing regular text. I have also tried inserting objects, a WordPad document and Text Box, into the document then putting the code inside those objects. The code looks much better and is easier to avoid while editing the rest of the text. However, these objects can only span one page which makes editing a nightmare when several pages of code need to be added. Lastly, I know that there are much better editors/formats that have no problem handling this but I am stuck working with MS word.
Here is the best way, for me, to add code inside word: Go to Insert tab, Text section, click Object button (it's on the right) Choose OpenDocument Text which will open a new embedded word document Copy and paste your code from Visual Studio / Eclipse inside this embedded word page Save and close Advantages The result looks very nice. Here are the advantages of this method: The code keeps its original layout and colors The code is separated from the rest of the document, as if it was a picture or a chart Spelling errors won't be highlighted in the code (this is cool !) And it takes only few seconds.
Download and install Notepad++ and do the following: Paste your code in the window; Select the programming language from the language menu; Select the text to copy; Right click and select Plugin commands -> Copy Text with Syntax Highlighting; Paste it into MS Word and you are good to go! Update 29/06/2013: Notepad++ has a plugin called "NppExport" (comes pre-installed) that allows you to copy to RTF, HTML and ALL. It permits dozens of languages, whereas the aforementioned IDEs are limited to a handful each (without other plug-ins). I use Copy all formats to clipboard and "paste as HTML" in MS word.
After reading a lot of related answers, I came across my own solution, which for me is the most suitable one. Result looks like this: As you can see, it is the same syntax highlighting like on Stack Overflow which is quite awesome. Steps to reproduce: on Stack Overflow Goto Ask Question (preferably with Chrome) Paste Code and add a language tag (e.g. Java) to get syntax hightlighting Copy code from preview in Word Insert > Table > 1x1 Paste code (you may need to use Paste Special... > Formatted Text (RTF) from the Edit menu to not lose the syntax hilighting) Table Design > Borders > No Border Select code > Edit > Find > Replace Search Document ^p (Paragraph Mark) Replace With ^l (Manual Line Break) (This is required to remove the gaps between some lines) Select code again > Review > Language > check "Do not check spelling or grammar" Finally add a caption using References > Insert Caption > New Label > name it "Listing" or sth Sample code thanks to this guy
There is a nice Online Tool for that : https://www.troye.io/planetb/ Just copy the generated code and paste it into your word editing software. So far I've tried it on MS Word and WPS Writer, works really well. Doesn't play nice with Firefox but works just fine on Chrome (and IE too, but who wants to use that). One of the main benefits is that, unlike the Code Format Add-In for Word, it does NOT mess with your code, and respects various languages' syntax. I tried many other options offered in other answers but I found this one to be the most efficient (quick and really effective). There is also another online tool quoted in another answer (markup.su) but I find the planetB output more elegant (although less versatile). Input : Output :
I type my code in Visual Studio, and then copy-paste into word. it preserves the colors.
When I've done this, I've made extensive use of styles. It helps a lot. What I do is create a paragraph style (perhaps called "Code Example" or something like that) which uses a monospaced font, carefully chosen tabs, a very light grey background, a thin black border above and below (that helps visibility a lot) and with spelling turned off. I also make sure that inter-line and inter-paragraph spacing are set right. I then create additional character styles on top (e.g., "Comment", "String", "Keyword", "Function Name Decl", "Variable Name Decl") which I layer on top; those set the color and whether the text is bold/italic. It's then pretty simple to go through and mark up a pasted example as being code and have it come out looking really good, and this is works well for short snippets. Long chunks of code probably should not normally be in something that's going to go on a dead tree. :-) An advantage of doing it this way is that it is easy to adapt to whatever code you're doing; you don't have to rely on some IDE to figure out whatever is going on for you. (The main problem? Printed pages typically aren't as wide as editor windows so wrapping will suck...)
Maybe this is overly simple, but have you tried pasting in your code and setting the font on it to Courier New?
Try defining a style called 'code' and make it use a small fixed width font, it should look better then. Use CTRL+SPACEBAR to reset style.
If you are using Sublime Text, you can copy the code from Sublime to MS Word preserving the syntax highlighting. Install the package called SublimeHighlight. In Sublime, using your cursor, select the code you want to copy, right click it, select 'copy as rtf', and paste into MS Word.
I'm using Easy Code Formatter. It's also an Office add-in. It allows you to select the coding style / and has a quick formatting button. Pretty neat.
In case you're like me and are too lazy or in a hurry and don't want to download additional software, you can use http://markup.su/highlighter/. It's very straight forward and supports several highlight themes and many programming languages. In my case I was using Visual Studio Code, which doesn't allow copying with format due to CSS involved in styling (as reported here). Copy the text from the Preview box and then in Word go to Insert -> Textbox, paste the Preview from the website, highlight all the text, and then disable spell checking for that textbox. This is what the code looks like finally.
The best way I found is by using the table. Create a table with 1x1. Then copy the code and paste it. If you're using the desktop app then it will inherit the code editor theme color and paste it accordingly, else you can change the table style to any color. UPDATE ------------------ From Word 2021, you can directly paste the code and it will preserve the formatting. No need to create the table. Thank you #RdC1965 for mentioning this.
This is a bit indirect, but it works very nicely. Get LiveWriter and install this plugin: http://lvildosola.blogspot.com/2007/02/code-snippet-plugin-for-windows-live.html Insert your code using the plugin into a blog post. Select all and copy it to Word. It looks great and can include line numbers. It also spans pages decently. HTH Colby Africa
Vim has a nifty feature that converts code to HTML format preserving syntax highlighting, font style, background color and even line numbers. Run :TOhtml and vim creates a new buffer containing html markup. Next, open this html file in a web browser and copy/paste whatever it rendered to Word. Vim tips wiki has more information.
In my experience copy-paste from eclipse and Notepad++ works directly with word. For some reason I had a problem with a file that didn't preserve coloring. I made a new .java file, copy-paste code to that, then copy-paste to word and it worked... As the other guys said, create a new paragraph style. What I do is use mono-spaced font like courier new, small size close to 8px for fonts, single spaced with no space between paragraphs, make tab stops small (0.5cm,1cm,..,5cm), put a simple line border around the text and disable grammar checks. That way i achieved the line braking of eclipse so I don't have to do anything more. Hope I helped ;)
This is the simplest approach I follow. Consider I want to paste java code. I paste the code here so that spaces, tabs and flower brackets are neatly formated http://www.tutorialspoint.com/online_java_formatter.htm Then I paste the code got from step 1 here so that the colors, fonts are added to the code http://markup.su/highlighter/ Then paste the preview code got from step 2 to the MS word. Finally it will look like this
You can use VS code to keep code format and highlighting. Directly copy and paste code from VS.
you can simply use this Add-in on any office program. Go to insert tab, then Get Add-ins, and search for Easy Syntax Highlighter It supports 185 languages and 89 themes. Automatic language detection. Multi-language code highlighting.
Use a monospaced font like Lucida Console, which comes with Windows. If you cut/paste from Visual Studio or something that supports syntax highlighting, you can often preserve the colour scheme of the syntax highlighter.
Answer for people trying to resolve this issue in 2019: Most answers to this question are outdated by now. I wish there was a way to reinspect old questions and answers every now and then! The method I found for this question that works with Office 365 and its associated programs can be found here.
I'm using Word 2010 and I like copying and paste from a github gist. Just remember to keep source formatting! I then change the font to DejaVu Sans Mono. You can opt to copy with or without the numbering.
Copying into Eclipse and paste it in Word is also another option.
You can also use SciTE to paste code if you don't want to install heavy IDEs and then download plugins for all the code you're making. Simply choose your language from the language menu, type your code, high-light code, select Edit->Copy as RTF, paste into Word with formatting (default paste). SciTE supports the following languages but probably has support for others: Abaqus*, Ada, ANS.1 MIB definition files*, APDL, Assembler (NASM, MASM), Asymptote*, AutoIt*, Avenue*, Batch files (MS-DOS), Baan*, Bash*, BlitzBasic*, Bullant*, C/C++/C#, Clarion, cmake*, conf (Apache), CSound, CSS*, D, diff files*, E-Script*, Eiffel*, Erlang*, Flagship (Clipper / XBase), Flash (ActionScript), Fortran*, Forth*, GAP*, Gettext, Haskell, HTML*, HTML with embedded JavaScript, VBScript, PHP and ASP*, Gui4Cli*, IDL - both MSIDL and XPIDL*, INI, properties* and similar, InnoSetup*, Java*, JavaScript*, LISP*, LOT*, Lout*, Lua*, Make, Matlab*, Metapost*, MMIXAL, MSSQL, nnCron, NSIS*, Objective Caml*, Opal, Octave*, Pascal/Delphi*, Perl, most of it except for some ambiguous cases*, PL/M*, Progress*, PostScript*, POV-Ray*, PowerBasic*, PowerShell*, PureBasic*, Python*, R*, Rebol*, Ruby*, Scheme*, scriptol*, Specman E*, Spice, Smalltalk, SQL and PLSQL, TADS3*, TeX and LaTeX, Tcl/Tk*, VB and VBScript*, Verilog*, VHDL*, XML*, YAML*.
If you are using Intellij IDEA, just copy the code from the IDE and paste it in the word document.
A web site for coloration with lots of languages. http://hilite.me/ You can host one yourself since it is open source. The code is on github.
There really isn't a clean way to do it, and it could still look fishy based on your exact style settings. What you could try to do is to first run a code-to-HTML conversion (there are many programs that do that), and then try to open up the HTML file with word, that might hopefully provide you with the formatted and pretty code, and then copy and paste it into your document.
I was also looking for it and ended up creating something for my code display. Here's a good way: Create a rectangular form and place your text inside. Change the font to Consolas and size ~10. Change the text font to gray near-black (gray 25%, darker 75%) Use darker colors to highlight your text if needed and choose one to be the contour.
I have created an easier method using tables, as they are easier to create, manage, and more consistent (with the possibility to save the table's style inside the document itself), but I couldn't find a better way for code colouring scheme, sorry for that. Steps: Create a 3x3 table. Select the table, and make its borders invisible ("No Borders" option), and activate "View Gridlines" option. Make the adjustments to cells' spacing and columns' widths to get the desired aspect. (You will have to get in "Table Properties" for fine tuning). Create a "Paragraph Style" with the name of "Code" just for your code snippets (as mentioned in https://stackoverflow.com/a/25092977/8533804) Create another "Paragraph Style" with the name of "Code_numberline" that will be based upon the previous created style, but this you will add a numbering line in its definition (this will automate line numbering). Apply "Code_numberline" to the first column, and "Code" to the 3 column. Add a fill in the middle column. Save that table style and enjoy!
The best presentation for code in documents is in a fixed-width font (as it should appear in an IDE), with either a faint, shaded background or a light border to distinguish the block from other text.
If its Java source code copy it to Visual Studio and then copy it back to Word.