Skip to content

Commit 887a0a6

Browse files
committed
docs($cn): update for new file-level API: style.styl.
1 parent c500201 commit 887a0a6

File tree

2 files changed

+36
-11
lines changed

2 files changed

+36
-11
lines changed

docs/default-theme-config/README.md

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -421,34 +421,30 @@ $codeBgColor = #282c34
421421

422422
### Existing issues <Badge text="< 0.12.0" type='error'/>
423423

424-
In order to override the default variables mentioned above, `override.styl` will be imported at the end of the `config.styl` in default theme, and this file will be used by multiple files, so once you wrote styles here, your style will be duplicated by multiple times. See [#637](https://github.com/vuejs/vuepress/issues/637).
425-
426-
In fact, `style constants override` and `styles override` are two things, the former should be executed before any CSS is compiled, while the latter should be generated at the end of the CSS bundle, which has the highest priority.
424+
In order to override the default variables mentioned above, `override.styl` will be imported at the end of the `config.styl` in default theme, and this file will be used by multiple files, so once you wrote styles here, your style would be duplicated by multiple times. See [#637](https://github.com/vuejs/vuepress/issues/637).
427425

428426
### Migrate your styles to `style.styl` <Badge text="0.12.0+"/>
429427

430-
Start from `0.12.0`, we split `override.styl` into two APIs: `override.styl` and `style.styl`:
428+
In fact, The `stylus constants override` should be completed before all Stylus files are compiled; and the `user's additional CSS styles` should be generated at the end of the final style file. Therefore, these two duties should not be completed by the same stylus file.
431429

432-
If you wrote styles at `override.styl` in the past, e.g.
430+
Start from `0.12.0`, we split `override.styl` into two APIs: `override.styl` and `style.styl`. If you wrote styles at `override.styl` in the past, e.g.
433431

434432
``` stylus
435433
// override.styl
436-
$textColor = red // style constants override
434+
$textColor = red // stylus constants override
437435
438-
#my-style {} // styles override or custom styles.
436+
#my-style {} // your extra styles.
439437
```
440438

441439
You'll need to separate the style part to `style.styl`:
442440

443441
``` stylus
444-
// override.styl
445-
// SHOULD ONLY focus on style constants override.
442+
// override.styl, SHOULD ONLY contain "stylus constants override".
446443
$textColor = red
447444
```
448445

449446
``` stylus
450-
// style.styl
451-
// SHOULD focus on styles override or your custom styles.
447+
// style.styl, your extra styles
452448
#my-style {}
453449
```
454450

docs/zh/default-theme-config/README.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -414,6 +414,35 @@ $borderColor = #eaecef
414414
$codeBgColor = #282c34
415415
```
416416

417+
### 低版本存在的问题 <Badge text="< 0.12.0" type='error'/>
418+
419+
为了 override 上述提及的 [Stylus](http://stylus-lang.com/) 默认样式常量,`override.styl` 将会在默认主题的 `config.styl` 的末尾被导入。但是,由于 `config.styl` 可能会被多个文件导入,所以,一旦你在这里写样式,你的样式将会被重复多次。参考: [#637](https://github.com/vuejs/vuepress/issues/637)
420+
421+
### 将你的样式迁移到 `style.styl` <Badge text="0.12.0+"/>
422+
423+
事实上,`stylus 常量的 override` 应该在编译所有 Stylus 文件之前完成;而用户额外的 CSS 样式由应该被生成在最终样式文件的末尾。因此这两项职责不应该由同一个 stylus 文件来完成。
424+
425+
`0.12.0` 开始,我们将 `override.styl` 拆分为两个 API:`override.styl``style.styl`。如果你过去在 `override.styl` 中书写了样式,如:
426+
427+
``` stylus
428+
// override.styl
429+
$textColor = red // stylus 常量的 override
430+
431+
#my-style {} // 你的样式
432+
```
433+
434+
你将需要将你的样式部分分离到 `style.styl`:
435+
436+
``` stylus
437+
// override.styl,应该仅仅包含 stylus 常量的 override
438+
$textColor = red
439+
```
440+
441+
``` stylus
442+
// style.styl,你的样式
443+
#my-style {}
444+
```
445+
417446
## 自定义页面类
418447

419448
有时候你可能需要为特定页面添加一个 CSS 类名,以方便针对该页面添加一些专门的 CSS。这种情况下你可以在该页面的 YAML front matter 中声明一个 `pageClass`

0 commit comments

Comments
 (0)