-
Notifications
You must be signed in to change notification settings - Fork 1.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Use languages with node.js #593
Comments
Currently this is not easily possible. You could reuse my implementation from here and then the file |
As @apfelbox pointed, the only way to do it by using |
Or you can use the Download page on the website to build a file that includes all the languages you need. |
Thank you! It would be super to find a better approach to this. |
I have the same problem. Can you consider creating a simple implementation that supports this scenario? |
@astoilkov as soon as #588 is merged, this could should work: var PrismLoader = require("tests/helper/prism-loader");
var Prism = PrismLoader.createInstance(["javascript", "css", "eiffel"]); We could probably move the prism loader to a separate helper directory, outside of |
I believe the API should be even more intuitive. Something like this: (that internally uses the PrismLoader): var Prism = require('prismjs');
Prism.loadLanguages('*'); // this could also be Prism.loadLanguages(['*']); for consistency
// or
Prism.loadLanguages(['go', 'csharp']); |
This would be the ideal world – but unlikely to happen. This would both mix a lot of functionality only available for node into prism, as well as being a massive BC break. So the current solution is ok in that regard, as it completely keeps BC. |
Thanks to the fix provided by @valorkin in PR #754, you can now use the components directly with node.js. var Prism = require('./components/prism-core.js');
require('./components/prism-markup.js');
require('./components/prism-markdown.js');
console.log(Prism.highlight('_foo_', Prism.languages.markdown, 'markdown'));
// Outputs:
// <span class="token italic" ><span class="token punctuation" >_</span>foo<span class="token punctuation" >_</span></span> Note that you have to handle the dependencies by yourself, though. |
@Golmote now prismjs can be used with web pack require see here // marked renderer hack
marked.Renderer.prototype.code = function (code, lang) {
var out = this.options.highlight(code, lang);
if (!lang) {
return '<pre><code>' + out + '\n</code></pre>';
}
var classMap = this.options.langPrefix + lang;
return '<pre class="' + classMap + '"><code class="' + classMap + '">' + out + '\n</code></pre>\n';
}; and markdownLoader: {
langPrefix: 'language-',
highlight: function (code, lang) {
var language = !lang || lang === 'html' ? 'markup' : lang;
var Prism = require('prismjs');
if (!Prism.languages[language]) {
require('prismjs/components/prism-' + language + '.js');
}
return Prism.highlight(code, Prism.languages[language]);
}
}, but in general I like PrismJs more over other similar tools :) |
It will be more friendly for Node.js developers, if: const Prism = require('prismjs/components/prism-all'); |
Hey, guys. I wrote an adapter to make it easier to use Prism in Node.js node-prismjs. |
So lemme get this straight: Currently people using Prism on Node have to individually If so, this is terrible, I’m so sorry, we need to fix it. :( |
Actually, the test runner already has a working & running loader for prism @LeaVerou @benjycui To reiterate my comment above:
In your own code you can just do: var PrismLoader = require("tests/helper/prism-loader");
var Prism = PrismLoader.createInstance(["php", "javascript", "bash"]); This will load all required language definitions in the correct order and generate a fresh instance every time. Somebody could use this implementation, clean it up and provide it as proper extension point for node.js users. |
@apfelbox sorry, I didn't notice that :-( So, are you going to expose this directly, or I should refactor |
@benjycui no worries. 😄 my comment first comment was quite sparse in details, so no wonder it gets by unnoticed. If you want to, you could take my implementation, clean it up, move it to the main directory and provide it as a proper extension point to node.js users. Afterwards you can refactor the test suite to use you newly exposed node.js API for generating As @LeaVerou mentioned, I think it would be nice to have something like this in core. |
@apfelbox But the helper uses |
I'm still pretty confused how to do this, i.e: const prism = require('prismjs');
const prismJsx = require('prismjs/components/prism-jsx'); The signature of (function(Prism) {
// ....
}(Prism)); But |
@dominictobias The components injects itself into the const Prism = require('prismjs');
require('prismjs/components/prism-jsx'); but notice you need Prism.languages.ini= {
'comment': /^\s*;.*$/m,
'important': /\[.*?\]/m,
'constant': /^\s*[^\s=]+?(?=[ \t]*=)/m,
'attr-value': {
pattern: /=.*/m,
inside: {
'punctuation': /^[=]/
}
}
}; So when you require that file, the component injects itself into Prism.languages. No need to do anything else |
@felixsanz thanks that works great, I didn't think prism-jsx could pick up that var name from another file :o |
It doesn't. you are importing prism-jsx into where Prism is |
Otherwise it also excludes /tests/helper/components.js, which is needed when attempting to use the trick suggested by @apfelbox in PrismJS#593 (comment)
Otherwise it also excludes /tests/helper/components.js, which is needed when attempting to use the trick suggested by @apfelbox in PrismJS#593 (comment) (cherry picked from commit 7be18be)
For the trick suggested by @apfelbox in PrismJS#593 (comment) to work, we need both of these files to be in the NPM package: /components.js /tests/helper/components.js
For the trick suggested by @apfelbox in #593 (comment) to work, we need both of these files to be in the NPM package: /components.js /tests/helper/components.js
To make the current PrismJS node package a lot friendlier, the following design improvements need to be done:
Below are less critical design improvements:
|
I made a package to expose |
@Soreine as previously mentioned, you could just have wrapped
|
Hmm I could have borrowed some logic from there... But when I had a look at it, I did not dig further because it is node specific (using |
What is the correct syntax for using plugins within node? |
@megamindbrian you can just use:
|
@adnanoner Tried that. Seems the |
See #972 on how to load components in Node using the |
I actually implemented my own solution to this issue. I created a prism-electron repo which is perfect for scenarios like Electron and nw.js. It lazy-loads languages and the size of the repo is a lot smaller. I am posting this here for anyone that has had the same problem like me. |
Currently I'm using Prism with node, I can do syntax highlight for the few languages that are part of prism.js file.
How can I use the ones found on components directoy?
Thank you
The text was updated successfully, but these errors were encountered: