Skip to content

Commit b64153d

Browse files
cm-igarashi-ryosukecm-igarashi-ryosuke
committed
fix: prismをshikiに置き換え
1 parent 48d1248 commit b64153d

40 files changed

+1108
-580
lines changed

‎packages/zenn-cli/src/server/api/articles.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import Express from 'express';
33
import { getLocalArticle, getLocalArticleMetaList } from '../lib/articles';
44
import { getValidSortTypes } from '../../common/helper';
55

6-
export function getArticle(req: Express.Request, res: Express.Response) {
7-
const article = getLocalArticle(req.params.slug);
6+
export async function getArticle(req: Express.Request, res: Express.Response) {
7+
const article = await getLocalArticle(req.params.slug);
88
if (!article) {
99
res
1010
.status(404)

‎packages/zenn-cli/src/server/api/books.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ export function getBooks(req: Express.Request, res: Express.Response) {
3232
res.json({ books });
3333
}
3434

35-
export function getChapter(req: Express.Request, res: Express.Response) {
35+
export async function getChapter(req: Express.Request, res: Express.Response) {
3636
const bookSlug = req.params.book_slug;
3737
const book = getLocalBookMeta(bookSlug);
3838
if (!book) {
@@ -42,7 +42,7 @@ export function getChapter(req: Express.Request, res: Express.Response) {
4242
return;
4343
}
4444
const chapterFilename = req.params.chapter_filename;
45-
const chapter = getLocalChapter(book, chapterFilename);
45+
const chapter = await getLocalChapter(book, chapterFilename);
4646
if (!chapter) {
4747
res
4848
.status(404)

‎packages/zenn-cli/src/server/lib/articles.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@ import { ItemSortType } from '../../common/types';
1414
import markdownToHtml from 'zenn-markdown-html';
1515
import { parseToc } from 'zenn-markdown-html/lib/utils';
1616

17-
export function getLocalArticle(slug: string): null | Article {
17+
export async function getLocalArticle(slug: string): Promise<null | Article> {
1818
const data = readArticleFile(slug);
1919
if (!data) return null;
2020
const { meta, bodyMarkdown } = data;
21-
const rawHtml = markdownToHtml(bodyMarkdown, {
21+
const rawHtml = await markdownToHtml(bodyMarkdown, {
2222
embedOrigin: process.env.VITE_EMBED_SERVER_ORIGIN,
2323
});
2424
const bodyHtml = completeHtml(rawHtml);

‎packages/zenn-cli/src/server/lib/books.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -85,15 +85,15 @@ export function getLocalBookMetaList(sort?: ItemSortType): BookMeta[] {
8585
return books;
8686
}
8787

88-
export function getLocalChapter(
88+
export async function getLocalChapter(
8989
book: BookMeta,
9090
chapterFilename: string
91-
): null | Chapter {
91+
): Promise<null | Chapter> {
9292
const data = readChapterFile(book, chapterFilename);
9393
if (!data) return null;
9494

9595
const { meta, bodyMarkdown } = data;
96-
const rawHtml = markdownToHtml(bodyMarkdown, {
96+
const rawHtml = await markdownToHtml(bodyMarkdown, {
9797
embedOrigin: process.env.VITE_EMBED_SERVER_ORIGIN,
9898
});
9999
const bodyHtml = completeHtml(rawHtml);

‎packages/zenn-content-css/src/_content.scss‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -208,13 +208,7 @@
208208
border-radius: variables.$rounded-xs;
209209
word-break: normal; // iOSで折り返されるのを防ぐ
210210
word-wrap: normal; // iOSで折り返されるのを防ぐ
211-
/* flex + codeの隣に疑似要素を配置することで横スクロール時の右端の余白を作る */
212211
display: flex;
213-
&:after {
214-
content: '';
215-
width: 8px;
216-
flex-shrink: 0;
217-
}
218212
code {
219213
margin: 0;
220214
padding: 0;

‎packages/zenn-content-css/src/_shiki.scss‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
@mixin styles {
2+
// Shiki base styles
3+
pre.shiki {
4+
position: relative;
5+
overflow-x: auto;
6+
}
7+
8+
// diff 行は背景色を全幅にするため inline-block + min-width
9+
.shiki .line.diff {
10+
display: inline-block;
11+
min-width: 100%;
12+
}
13+
14+
// diff モード: 追加行（+）の背景色
15+
.shiki .line.diff.add {
16+
background: rgba(0, 146, 27, 0.2);
17+
}
18+
19+
// diff モード: 削除行（-）の背景色
20+
.shiki .line.diff.remove {
21+
background: rgba(218, 54, 50, 0.2);
22+
}
23+
}

‎packages/zenn-content-css/src/index.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@use 'sass:map';
22
@use './content' as content;
33
@use './embed' as embed;
4-
@use './prism' as prism;
4+
@use './shiki' as shiki;
55
@use './message' as message;
66
@use './footnotes' as footnotes;
77

@@ -75,7 +75,7 @@
7575

7676
@include content.styles;
7777
@include embed.styles;
78-
@include prism.styles;
78+
@include shiki.styles;
7979
@include message.styles;
8080
@include footnotes.styles;
8181
}

‎packages/zenn-markdown-html/.babelrc.json‎

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,4 @@
11
{
22
"targets": "node 16.0",
3-
"presets": ["@babel/preset-env", "@babel/preset-typescript"],
4-
"plugins": [
5-
[
6-
"prismjs",
7-
{
8-
"languages": "all"
9-
}
10-
]
11-
]
3+
"presets": ["@babel/preset-env", "@babel/preset-typescript"]
124
}

‎packages/zenn-markdown-html/__tests__/basic.test.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import markdownToHtml from '../src/index';
33
import { parse } from 'node-html-parser';
44

55
describe('MarkdownからHTMLへの変換テスト', () => {
6-
test('markdownからhtmlへ変換する', () => {
7-
const html = markdownToHtml('Hello\n## hey\n\n- first\n- second\n');
6+
test('markdownからhtmlへ変換する', async () => {
7+
const html = await markdownToHtml('Hello\n## hey\n\n- first\n- second\n');
88
const p = parse(html).querySelector('p');
99
const h2 = parse(html).querySelector('h2');
1010
const ul = parse(html).querySelector('ul');
@@ -20,13 +20,13 @@ describe('MarkdownからHTMLへの変換テスト', () => {
2020
expect(liElms[1].innerHTML).toBe('second');
2121
});
2222

23-
test('インラインコメントはhtmlに変換しない', () => {
24-
const html = markdownToHtml(`<!-- hey -->`);
23+
test('インラインコメントはhtmlに変換しない', async () => {
24+
const html = await markdownToHtml(`<!-- hey -->`);
2525
expect(html).not.toContain('hey');
2626
});
2727

28-
test('脚注に docId を設定する', () => {
29-
const html = markdownToHtml(`Hello[^1]World!\n\n[^1]: hey`);
28+
test('脚注に docId を設定する', async () => {
29+
const html = await markdownToHtml(`Hello[^1]World!\n\n[^1]: hey`);
3030
// expect(html).toContain('<a href="#fn-27-1" id="fnref-27-1">[1]</a>');
3131
expect(html).toEqual(
3232
expect.stringMatching(
@@ -35,8 +35,8 @@ describe('MarkdownからHTMLへの変換テスト', () => {
3535
);
3636
});
3737

38-
test('dataスキーマの画像は除外する', () => {
39-
const html = markdownToHtml(`![](data:image/png;base64,xxxx)`);
38+
test('dataスキーマの画像は除外する', async () => {
39+
const html = await markdownToHtml(`![](data:image/png;base64,xxxx)`);
4040
expect(html).toContain('<img alt="" class="md-img" loading="lazy" />');
4141
});
4242
});

‎packages/zenn-markdown-html/__tests__/br.test.ts‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,28 @@ import { describe, test, expect } from 'vitest';
22
import markdownToHtml from '../src/index';
33

44
describe('<br /> のテスト', () => {
5-
test('段落内の<br />は保持する', () => {
5+
test('段落内の<br />は保持する', async () => {
66
const patterns = ['foo<br>bar', 'foo<br/>bar', 'foo<br />bar'];
7-
patterns.forEach((pattern) => {
8-
const html = markdownToHtml(pattern);
7+
for (const pattern of patterns) {
8+
const html = await markdownToHtml(pattern);
99
expect(html).toContain('foo<br />bar');
10-
});
10+
}
1111
});
12-
test('テーブル内の<br />は保持する', () => {
12+
test('テーブル内の<br />は保持する', async () => {
1313
const tableString = [
1414
`| a | b |`,
1515
`| --- | --- |`,
1616
`| foo<br>bar | c |`,
1717
].join('\n');
18-
const html = markdownToHtml(tableString);
18+
const html = await markdownToHtml(tableString);
1919
expect(html).toContain('foo<br />bar');
2020
});
21-
test('インラインコード内の<br />はエスケープする', () => {
22-
const html = markdownToHtml('foo`<br>`bar');
21+
test('インラインコード内の<br />はエスケープする', async () => {
22+
const html = await markdownToHtml('foo`<br>`bar');
2323
expect(html).toContain('foo<code>&lt;br&gt;</code>bar');
2424
});
25-
test('コードブロック内の<br />はエスケープする', () => {
26-
const html = markdownToHtml('```\n<br>\n```');
25+
test('コードブロック内の<br />はエスケープする', async () => {
26+
const html = await markdownToHtml('```\n<br>\n```');
2727
expect(html).toContain('&lt;br&gt;');
2828
});
2929
});

0 commit comments

Comments
 (0)