diff --git a/site/src/routes/api/blog/_posts.js b/site/src/routes/api/blog/_posts.js index 5a9765dfd0..8b70483cd1 100644 --- a/site/src/routes/api/blog/_posts.js +++ b/site/src/routes/api/blog/_posts.js @@ -3,58 +3,53 @@ import path from 'path'; import process_markdown from '../../../utils/_process_markdown.js'; import marked from 'marked'; -// import hljs from 'highlight.js'; -import prismjs from 'prismjs'; // prism-highlighter – smaller footprint [hljs: 192.5k] -require('prismjs/components/prism-bash'); +import PrismJS from 'prismjs'; +import 'prismjs/components/prism-bash'; // map lang to prism-language-attr const prismLang = { - bash: 'bash', - html: 'markup', - js: 'javascript', - css: 'css', + bash: 'bash', + html: 'markup', + js: 'javascript', + css: 'css', }; export default function() { - return fs - .readdirSync('content/blog') - .map(file => { - if (path.extname(file) !== '.md') return; - - const markdown = fs.readFileSync(`content/blog/${file}`, 'utf-8'); - - const { content, metadata } = process_markdown(markdown); - - const date = new Date(`${metadata.pubdate} EDT`); // cheeky hack - metadata.dateString = date.toDateString(); - - const renderer = new marked.Renderer(); - - renderer.code = (source, lang) => { - let plang = prismLang[lang]; - const highlighted = Prism.highlight( - source, - Prism.languages[plang], - lang, - ); - - return `
${highlighted}
`;
- };
-
- const html = marked(
- content.replace(/^\t+/gm, match => match.split('\t').join(' ')),
- {
- renderer,
- },
- );
-
- return {
- html,
- metadata,
- slug: file.replace(/^[\d-]+/, '').replace(/\.md$/, ''),
- };
- })
- .sort((a, b) => {
- return a.metadata.pubdate < b.metadata.pubdate ? 1 : -1;
- });
+ return fs
+ .readdirSync('content/blog')
+ .map(file => {
+ if (path.extname(file) !== '.md') return;
+
+ const markdown = fs.readFileSync(`content/blog/${file}`, 'utf-8');
+
+ const { content, metadata } = process_markdown(markdown);
+
+ const date = new Date(`${metadata.pubdate} EDT`); // cheeky hack
+ metadata.dateString = date.toDateString();
+
+ const renderer = new marked.Renderer();
+
+ renderer.code = (source, lang) => {
+ const plang = prismLang[lang];
+ const highlighted = PrismJS.highlight(
+ source,
+ PrismJS.languages[plang],
+ lang,
+ );
+
+ return `${highlighted}
`;
+ };
+
+ const html = marked(
+ content.replace(/^\t+/gm, match => match.split('\t').join(' ')),
+ { renderer }
+ );
+
+ return {
+ html,
+ metadata,
+ slug: file.replace(/^[\d-]+/, '').replace(/\.md$/, ''),
+ };
+ })
+ .sort((a, b) => a.metadata.pubdate < b.metadata.pubdate ? 1 : -1);
}
diff --git a/site/src/routes/guide/_sections.js b/site/src/routes/guide/_sections.js
index fd15fb4571..6b282115d3 100644
--- a/site/src/routes/guide/_sections.js
+++ b/site/src/routes/guide/_sections.js
@@ -4,13 +4,8 @@ import * as fleece from 'golden-fleece';
import process_markdown from '../../utils/_process_markdown.js';
import marked from 'marked';
-import Prism from 'prismjs'; // prism-highlighter – smaller footprint [hljs: 192.5k]
-require('prismjs/components/prism-bash');
-
-const langs = {
- 'hidden-data': 'json',
- 'html-no-repl': 'html',
-};
+import PrismJS from 'prismjs';
+import 'prismjs/components/prism-bash';
// map lang to prism-language-attr
const prismLang = {
@@ -20,10 +15,6 @@ const prismLang = {
css: 'css',
};
-function btoa(str) {
- return new Buffer(str).toString('base64');
-}
-
const escaped = {
'"': '"',
"'": ''',
@@ -112,13 +103,6 @@ export default function() {
let className = 'code-block';
if (lang === 'html' && !group) {
- /* prettier-ignore
- -----------------------------------------------
- edit vedam
- don't know how to access components here
- so i hardcoded icon here
- -----------------------------------------------
- */
if (!meta || meta.repl !== false) {
prefix = ``;
}
@@ -140,16 +124,10 @@ export default function() {
if (meta && meta.hidden) return '';
- /* prettier-ignore
- -----------------------------------------------
- design-edit vedam
- insert prism-highlighter
- -----------------------------------------------
- */
- let plang = prismLang[lang];
- const highlighted = Prism.highlight(
+ const plang = prismLang[lang];
+ const highlighted = PrismJS.highlight(
source,
- Prism.languages[plang],
+ PrismJS.languages[plang],
lang
);