Skip to content

Commit

Permalink
fix wordful line break important bug
Browse files Browse the repository at this point in the history
  • Loading branch information
aprosail committed Jun 23, 2024
2 parents 8d9e5d2 + 08bc328 commit e7eb0a0
Show file tree
Hide file tree
Showing 9 changed files with 27 additions and 124 deletions.
5 changes: 5 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
## v1.1.1

- Fix wordful line break bug (important).
- Link English doc to root readme file.

## v1.1.0

- Optimization for emoji spaces.
Expand Down
8 changes: 4 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ which will disable all spaces when line break

```ts
import md from "markdown-it"
md.renderer.rules.softbreak = () => ""
md.renderer.rules.softbreak = () => "" // [!code focus]
```

But once working with multi-languages,
Expand All @@ -33,7 +33,7 @@ and you can use it like this:
```ts
import md from "markdown-it"
import {Options} from "markdown-it-wordless"
md.use(wordless)
md.use(wordless) // [!code focus]
```

## Basic rules
Expand Down Expand Up @@ -62,7 +62,7 @@ import {wordless} from "markdown-it-wordless"
export default defineConfig({
markdown: {
config(md) {
md.use(wordless)
md.use(wordless) // [!code focus]
},
},
// Other configs...
Expand All @@ -85,7 +85,7 @@ if you will only use Chinese or Japanese as wordless languages:
```ts
import md from "markdown-it"
import {wordless, chineseAndJapanese, Options} from "markdown-it-wordless"
md.use<Options>(wordless, {supportWordless: [chineseAndJapanese]})
md.use<Options>(wordless, {supportWordless: [chineseAndJapanese]}) // [!code focus]
```

Such optimization is unnecessary in most cases,
Expand Down
4 changes: 3 additions & 1 deletion data.ts
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,9 @@ export function langIndexOf(code: number, options?: Options): number {
if (import.meta.vitest) {
const {expect, test} = import.meta.vitest

test("basic function", function () {
test("zh,ja punctuations", function () {
expect(langIndexOf(",".charCodeAt(0))).toBe(-3)
expect(langIndexOf("。".charCodeAt(0))).toBe(-3)
expect(langIndexOf("、".charCodeAt(0))).toBe(-3)
})
}
4 changes: 4 additions & 0 deletions docs/.vitepress/theme/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
import DefaultTheme from "vitepress/theme"
import "./root.css"

export default DefaultTheme
4 changes: 4 additions & 0 deletions docs/.vitepress/theme/root.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
html:lang("zh") div.vp-doc p {
text-indent: 2rem;
text-align: justify;
}
114 changes: 1 addition & 113 deletions docs/index.md
Original file line number Diff line number Diff line change
@@ -1,113 +1 @@
# Markdown-it Wordless

A [markdown-it](https://markdown-it.github.io) plugin
to optimize wordless multi-language line-break render.

When a paragraph is long in markdown, we usually separate them into lines,
and it will finally be rendered into a single line inside HTML.
But for wordless languages (such as Chinese and Japanese),
they do not use spaces to separate words,
that they don't need a space to be added when processing line-break.

If you are only working with a single wordless language,
you can definitely use the following code,
which will disable all spaces when line break
(render single `\n` into an empty string rather than a space):

```ts
import md from "markdown-it"
md.renderer.rules.softbreak = () => ""
```

But once working with multi-languages,
especially when there's a mix of wordless and wordful languages,
such as using Chinese and English in a single markdown document,
such options cannot handle all cases.
So here comes this `"markdown-it-wordless"` plugin,
and you can use it like this:

```ts
import md from "markdown-it"
import {Options} from "markdown-it-wordless"
md.use(wordless)
```

## Basic rules

1. Wordful languages (such as English and Arabic) will be rendered as usual.
2. It won't add a space when line break between the same wordless language.
3. It will add a space when line break between different wordless languages.
4. Specially, Chinese and Japanese will be treated as a same language,
as there are many shared characters between them,
and their character styles are almost the same.
5. Although Korean characters are like Chinese and Japanese (CJK),
Korean is not a wordless language, it uses spaces to separate words.

## Use it with VitePress

[VitePress](https://vitepress.dev) is an excellent static site generator,
and this package is also inspired when the author using VitePress.
It's strongly recommended to add such plugin to VitePress
if you are using wordless languages. And here's how to config:

```ts
// <root>/.vitepress/config.ts
import {defineConfig} from "vitepress"
import {wordless} from "markdown-it-wordless"

export default defineConfig({
markdown: {
config(md) {
md.use(wordless)
},
},
// Other configs...
})
```

## Customize to optimize performance

The default option will enable optimization
for all registered wordless languages inside this package.
If you want to optimize performance,
you can specify what exactly wordless language you are using.
You may also specify what wordful language you are using,
because there's only optimization for wordful languages
which unicode is less than `0x0dff`.

Here's a simple example
if you will only use Chinese or Japanese as wordless languages:

```ts
import md from "markdown-it"
import {wordless, chineseAndJapanese, Options} from "markdown-it-wordless"
md.use<Options>(wordless, {supportWordless: [chineseAndJapanese]})
```

Such optimization is unnecessary in most cases,
because this plugin will not slow down the rendering process a lot
in common cases (only a few milliseconds).
And if you do want to customize,
please make sure you've understand the source code. Please refer to
[`data.ts`](https://github.com/treeinfra/markdown-it-wordless/blob/main/data.ts)
for more details,
and here's documentation for each item in details.

## About the supported languages

You can find all supported languages
in the source code of
[`data.ts`](https://github.com/treeinfra/markdown-it-wordless/blob/main/data.ts).
Each language or language series is an exported const
that you can import and call.

The languages series are based on the [Unicode](https://unicode.org/charts/).
Most of the languages are coded manually and some of them are
generated by several AI models. So that there might be mistakes,
and the author cannot guarantee the accuracy of the data
because it's almost impossible for a single person to learn all such languages.

If you are native speaker of one of the those wordless languages
and you find there are some mistakes,
or if there's even some wordless languages not included in this package,
please feel free to open an issue.
<!-- @include: ../README.md -->
8 changes: 4 additions & 4 deletions docs/zh/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@
但 Markdown 在渲染时会默认将换行渲染为空格,
而这样的空格在中文这种不用空格分割词汇的语言中显然是不合适的。

```ts
```ts:line-numbers
import md from "markdown-it"
md.renderer.rules.softbreak = () => ""
md.renderer.rules.softbreak = () => "" // [!code focus]
```

在使用 [markdown-it](https://markdown-it.github.io) 时,
Expand All @@ -22,8 +22,8 @@ md.renderer.rules.softbreak = () => ""
使用这个插件后,使用 Markdown 编辑中文这样的语言时,
就可以随意的换行来而不必担心句子里被添加不美观的空格的问题了。

```ts
```ts:line-numbers
import md from "markdown-it"
import {Options} from "markdown-it-wordless"
md.use(wordless)
md.use(wordless) // [!code focus]
```
2 changes: 1 addition & 1 deletion index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export function wordless(md: md, options?: Options) {
const before = langIndexOf(prefix.charCodeAt(prefix.length - 1), options)
const after = langIndexOf(suffix.charCodeAt(0), options)

if (before === after) return "" // Same wordless language.
if (before === after && before >= 0) return "" // Same wordless language.
if (before === -3 || after === -3) return "" // Special punctuations.
if ((before === -2 && after >= 0) || (after === -2 && before >= 0))
return "" // Resolve emoji.
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "markdown-it-wordless",
"description": "A markdown-it plugin for wordless languages line-break.",
"version": "1.1.0",
"version": "1.1.1",
"type": "module",
"license": "MIT",
"keywords": [
Expand Down

0 comments on commit e7eb0a0

Please sign in to comment.