Skip to content

Commit 4770e6f

Browse files
author
sqrtthree
committed
👽 🐛 fix: Updating code due to API changes of VuePress
1 parent 4cbb3b5 commit 4770e6f

File tree

9 files changed

+140
-78
lines changed

9 files changed

+140
-78
lines changed

‎Layout.vue‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,6 @@
2828
<script>
2929
import Vue from 'vue'
3030
import nprogress from 'nprogress'
31-
import { pathToComponentName } from '@app/util'
3231
3332
import Sidebar from './components/Sidebar'
3433
import Home from './Home'
@@ -82,10 +81,7 @@ export default {
8281
nprogress.configure({ showSpinner: false })
8382
8483
this.$router.beforeEach((to, from, next) => {
85-
if (
86-
to.path !== from.path &&
87-
!Vue.component(pathToComponentName(to.path))
88-
) {
84+
if (to.path !== from.path && !Vue.component(to.name)) {
8985
nprogress.start()
9086
}
9187

‎Page.vue‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -135,8 +135,4 @@ export default {
135135
136136
p
137137
color: #888
138-
139-
pre
140-
border: 1px solid #333
141-
background-color: $black !important
142138
</style>

‎docs/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ home: true
33
title: Hello, World.
44
description: Not sure where to start? We’ve put together some handy guides and reference documentation you can use to start building.
55
actionText: Getting Started
6-
actionLink: /zh/getting-started
6+
actionLink: /zh/getting-started/
77
footer: Open Source on [GitHub](https://github.com/sqrthree/vuepress-theme-api), Made by [@sqrthree](https://github.com/sqrthree), Power by [vuepress](https://github.com/vuejs/vuepress).
88
---
99

‎docs/zh/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ home: true
33
title: Hello, World.
44
description: 不知道从哪里开始？我们准备了一些你可以用来开始构建的便捷指南和参考文档。
55
actionText: 开始出发
6-
actionLink: /getting-started
6+
actionLink: /zh/getting-started/
77
footer: Open Source on [GitHub](https://github.com/sqrthree/vuepress-theme-api), Made by [@sqrthree](https://github.com/sqrthree), Power by [vuepress](https://github.com/vuejs/vuepress).
88
---
99

‎docs/zh/configurations/README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ footer: Open Source on [GitHub](https://github.com/sqrthree/vuepress-theme-api),
9696

9797
文档页默认采用普通形式（通栏）的布局结构，例如 [起步页面](/zh/getting-started/)。同时得益于 `VuePress` 的 [组件支持特性](https://vuepress.vuejs.org/zh/guide/using-vue.html#%E6%B5%8F%E8%A7%88%E5%99%A8%E7%9A%84-api-%E8%AE%BF%E9%97%AE%E9%99%90%E5%88%B6)，我们可以在 Markdown 文件中直接使用 Vue 组件。因此，我们可以轻松构造出本页面这种 `RESTful API` 友好的页面布局。
9898

99-
要使用这种布局，需要了解主题内提供的几个组件。具体使用方式请参考 [内置组件](zh/configurations/components.html)。
99+
要使用这种布局，需要了解主题内提供的几个组件。具体使用方式请参考 [内置组件](/zh/configurations/components.html)。
100100

101101
如果你觉得内置组件过于繁琐，也可以通过在文件顶部的 `YAML front matter` 中配置 `enhance: true` 启用**增强模式**。
102102

‎docs/zh/configurations/components.md‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -76,15 +76,17 @@ Some examples...
7676

7777
例如下面的内容将会渲染成右侧的形式：
7878

79-
<CURL>
80-
```bash
81-
curl -X POST http://api.example.com/api/auth/login \
82-
--data '{
83-
"username": "my-username",
84-
"password": "my-password"
85-
}'
86-
```
87-
</CURL>
79+
````vue
80+
<CURL>
81+
```bash
82+
curl -X POST http://api.example.com/api/auth/login \
83+
--data '{
84+
"username": "my-username",
85+
"password": "my-password"
86+
}'
87+
```
88+
</CURL>
89+
````
8890

8991
`CURL` 组件会在组件下方自动生成一个按钮，当点击按钮时，会通过分析 `curl` 命令内的参数，通过 `JS` 发送请求到对应的地址上。并将其请求信息输出到浏览器开发者工具中的控制台上。方便进行快速测试和预览。
9092

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
"doc": "docs"
2323
},
2424
"scripts": {
25+
"dev": "npm run docs:dev",
2526
"docs:dev": "vuepress dev docs",
2627
"docs:build": "vuepress build docs",
2728
"docs:serve": "serve --single docs/.vuepress/dist",

‎styles/_components/_code.styl‎

Lines changed: 115 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,95 +1,154 @@
11
@require '../_variables'
22

33
.content
4+
45
code
56
color #f81ce5
67
padding 0.25rem 0.5rem
78
margin 0
89
font-size 0.85em
10+
background-color rgba(27,31,35,0.05)
911
border-radius 3px
1012

1113
.content
14+
1215
pre, pre[class*="language-"]
13-
background-color $codeBgColor
1416
line-height 1.4
15-
border-radius 6px
16-
padding 1.5rem 1.5rem
17-
margin 0.85rem 0
18-
white-space pre-wrap
19-
word-break break-word
17+
padding 1.25rem 1.5rem
18+
background transparent
2019
overflow auto
21-
position relative
2220

2321
code
2422
color #fff
2523
padding 0
2624
background-color transparent
2725
border-radius 0
2826

29-
&:before
27+
div[class*="language-"]
28+
position relative
29+
border: 1px solid $codeBgColor
30+
margin 0.85rem 0
31+
background-color $codeBgColor
32+
border-radius 6px
33+
34+
.highlight-lines
35+
user-select none
36+
position absolute
37+
top 0
38+
left 0
39+
width 100%
40+
padding 1.25rem 0
41+
margin: 0.5em 0
42+
line-height 1.4
43+
44+
.highlighted
45+
background-color rgba(0, 0, 0, 66%)
46+
47+
48+
pre
49+
position relative
50+
z-index 1
51+
52+
&::before
53+
position absolute
54+
z-index 3
55+
top 0.8em
56+
right 1em
57+
font-size 0.75rem
58+
color rgba(255, 255, 255, 0.4)
59+
60+
&:not(.line-numbers-mode)
61+
62+
.line-numbers-wrapper
63+
display none
64+
65+
&.line-numbers-mode
66+
67+
.highlight-lines .highlighted
68+
position relative
69+
70+
&:before
71+
content ' '
72+
position absolute
73+
z-index 3
74+
left 0
75+
top 0
76+
display block
77+
width 3.5rem
78+
height 100%
79+
background-color rgba(0, 0, 0, 66%)
80+
pre
81+
padding-left 5.5rem
82+
vertical-align middle
83+
84+
.line-numbers-wrapper
3085
position absolute
31-
top 0.8em
32-
right 1em
33-
font-size 0.75rem
34-
color rgba(255, 255, 255, 0.4)
35-
36-
.highlighted-line
37-
background-color rgba(0, 0, 0, 66%)
38-
display block
39-
margin 0 -1.5rem
40-
padding 0 1.5rem
41-
42-
.examples
43-
.highlighted-line
44-
background-color rgba(255, 255, 255, 0.2)
45-
46-
pre[class="language-js"], pre[class="language-javascript"]
86+
top 0
87+
width 3.5rem
88+
text-align center
89+
color rgba(255, 255, 255, 0.3)
90+
padding 1.25rem 0
91+
line-height 1.4
92+
93+
br
94+
user-select none
95+
96+
.line-number
97+
position relative
98+
z-index 4
99+
user-select none
100+
font-size 0.85em
101+
102+
&::after
103+
content ''
104+
position absolute
105+
z-index 2
106+
top 0
107+
left 0
108+
width 3.5rem
109+
height 100%
110+
border-radius 6px 0 0 6px
111+
border-right 1px solid rgba(0, 0, 0, 66%)
112+
background-color $codeBgColor
113+
114+
115+
for lang in js ts html md vue css sass scss less stylus go java c sh yaml
116+
div{'[class*="language-' + lang + '"]'}
117+
&:before
118+
content ('' + lang)
119+
120+
div[class*="language-javascript"]
47121
&:before
48122
content "js"
49123

50-
pre[class="language-html"], pre[class="language-markup"]
124+
div[class*="language-typescript"]
125+
&:before
126+
content "ts"
127+
128+
div[class*="language-markup"]
51129
&:before
52130
content "html"
53131

54-
pre[class="language-markdown"], pre[class="language-md"]
132+
div[class*="language-markdown"]
55133
&:before
56134
content "md"
57135

58-
pre[class="language-vue"]:before
59-
content "vue"
60-
61-
pre[class="language-css"]:before
62-
content "css"
63-
64-
pre[class="language-sass"]:before
65-
content "sass"
66-
67-
pre[class="language-less"]:before
68-
content "less"
69-
70-
pre[class="language-scss"]:before
71-
content "scss"
72-
73-
pre[class="language-stylus"]:before
74-
content "stylus"
75-
76-
pre[class="language-json"]:before
136+
div[class*="language-json"]:before
77137
content "json"
78138

79-
pre[class="language-ruby"]:before
139+
div[class*="language-ruby"]:before
80140
content "rb"
81141

82-
pre[class="language-python"]:before
142+
div[class*="language-python"]:before
83143
content "py"
84144

85-
pre[class="language-go"]:before
86-
content "go"
87-
88-
pre[class="language-java"]:before
89-
content "java"
145+
div[class*="language-bash"]:before
146+
content "sh"
90147

91-
pre[class="language-c"]:before
92-
content "c"
148+
.examples
149+
div[class*="language-"]
150+
background: black
151+
border-color: #333
93152

94-
pre[class="language-bash"]:before
95-
content "sh"
153+
.highlighted
154+
background-color rgba(255, 255, 255, 0.2) !important

‎utils.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -213,6 +213,14 @@ export function normalize(path) {
213213
return isAbsolute ? '/' + p : p
214214
}
215215

216+
export function padTrailingSlash(path) {
217+
return path.endsWith('/') ? path : path + '/'
218+
}
219+
216220
export function localizePath(path, localeBase) {
217-
return path.startsWith(localeBase) ? path : normalize(localeBase + path)
221+
const result = path.startsWith(localeBase)
222+
? path
223+
: normalize(localeBase + path)
224+
225+
return padTrailingSlash(result)
218226
}

0 commit comments

Comments
 (0)