PrismJS / prism

Lightweight, robust, elegant syntax highlighting.
https://prismjs.com
MIT License
12.34k stars 1.29k forks source link

Automatically downloaded customised files #2404

Open sixhobbits opened 4 years ago

sixhobbits commented 4 years ago

Motivation The feature where you can minify the code by selecting which languages you need support for before clicking 'download' is nice, but it would be great to do this automatically (e.g. to add to build tools).

Clicking the relevant checkboxes on the website generates a URL like https://prismjs.com/download.html#themes=prism-funky&languages=markup+css+clike+javascript+haskell+protobuf+purebasic

And we can evidently automatically create this URL. But then the "Download JS" and "Download CSS" buttons have to be pressed manually to trigger the actual download.

Description And endpoint or similar where I could download the CSS and JS files from a customised URL directly e.g.

GET https://prismjs.com/download.html#themes=prism-funky&languages=markup+css+clike+javascript+haskell+protobuf+purebasic?download=js

GET https://prismjs.com/download.html#themes=prism-funky&languages=markup+css+clike+javascript+haskell+protobuf+purebasic?download=css

Alternatives Visiting the website manually or trying to reverse engineer the javascript that triggers the download button.

RunDevelopment commented 4 years ago

We statically serve your website via Github pages, so I don't think we could even do these get requests even if we wanted to.

The alternative doesn't seem nice either tho.

sixhobbits commented 4 years ago

Thanks for the information. Is there a higher level overview of how the customization tool works? e.g. to help reproduce it locally? The JavaScript source seems a bit convoluted.

RunDevelopment commented 4 years ago

Yeah, the script does a bunch of things...

The actual build process is quite easy. We just take the list of languages/plugins the user selected, pass it to getLoader, and get a sorted list of ids from that. We then concatenate all JS/CSS files (see the path attribute (each category has one)) of the sorted list of ids (in order) and that's the final output.

(It also has to include prism-core.js and the actual theme. We also have to handle that only some plugins have CSS files.)

That's the basics of what the build process is. Right now at least. It will be able to do more after #2162.

I also want to add that components.json, while required by getLoader, is not part of the public API and we might change the layout of the object at any time.

siavashs commented 4 years ago

It would be great to provide an npm task to produce the development/minified version based on a component/plugin list, maybe some logic from dependencies.js can be borrowed.

RunDevelopment commented 4 years ago

Instead of an npm task, we could also do a simple CLI. This could be used like this:

npx prismjs bundle --languages=html,css,java --out-js=./prism.js --out-css=./prism.css

We could also use a configuration file (maybe similar to this format?) instead of CLI arguments or both.