@vuepress/client 2.0.0-rc.3 → 2.0.0-rc.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/app.d.ts +4 -6
- package/dist/app.js +255 -317
- package/dist/chunk-pbuEa-1d.js +13 -0
- package/dist/constants-COBTj3zj.js +57 -0
- package/dist/index-CNztZIId.d.ts +117 -0
- package/dist/index.d.ts +274 -254
- package/dist/index.js +3 -72
- package/dist/setupDevtools-B3cgI7XH.js +64 -0
- package/dist/utils-CIxUK0LM.js +405 -0
- package/package.json +34 -38
- package/types.d.ts +2 -2
- package/dist/chunk-2SMBJWK6.js +0 -394
- package/dist/createVueAppFunction-YNGNKfE3.d.ts +0 -9
- package/dist/setupDevtools-X4YFRK4B.js +0 -89
package/dist/index.js
CHANGED
|
@@ -1,72 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
VPLink,
|
|
5
|
-
defineClientConfig,
|
|
6
|
-
layoutsSymbol,
|
|
7
|
-
pageDataSymbol,
|
|
8
|
-
pageFrontmatterSymbol,
|
|
9
|
-
pageHeadSymbol,
|
|
10
|
-
pageHeadTitleSymbol,
|
|
11
|
-
pageLangSymbol,
|
|
12
|
-
pageLayoutSymbol,
|
|
13
|
-
redirects,
|
|
14
|
-
resolveRoute,
|
|
15
|
-
resolveRoutePath,
|
|
16
|
-
resolvers,
|
|
17
|
-
routeLocaleSymbol,
|
|
18
|
-
routes,
|
|
19
|
-
siteData,
|
|
20
|
-
siteLocaleDataSymbol,
|
|
21
|
-
updateHeadSymbol,
|
|
22
|
-
useLayouts,
|
|
23
|
-
usePageData,
|
|
24
|
-
usePageFrontmatter,
|
|
25
|
-
usePageHead,
|
|
26
|
-
usePageHeadTitle,
|
|
27
|
-
usePageLang,
|
|
28
|
-
usePageLayout,
|
|
29
|
-
useRedirects,
|
|
30
|
-
useRouteLocale,
|
|
31
|
-
useRoutes,
|
|
32
|
-
useSiteData,
|
|
33
|
-
useSiteLocaleData,
|
|
34
|
-
useUpdateHead,
|
|
35
|
-
withBase
|
|
36
|
-
} from "./chunk-2SMBJWK6.js";
|
|
37
|
-
export {
|
|
38
|
-
ClientOnly,
|
|
39
|
-
Content,
|
|
40
|
-
VPLink,
|
|
41
|
-
defineClientConfig,
|
|
42
|
-
layoutsSymbol,
|
|
43
|
-
pageDataSymbol,
|
|
44
|
-
pageFrontmatterSymbol,
|
|
45
|
-
pageHeadSymbol,
|
|
46
|
-
pageHeadTitleSymbol,
|
|
47
|
-
pageLangSymbol,
|
|
48
|
-
pageLayoutSymbol,
|
|
49
|
-
redirects,
|
|
50
|
-
resolveRoute,
|
|
51
|
-
resolveRoutePath,
|
|
52
|
-
resolvers,
|
|
53
|
-
routeLocaleSymbol,
|
|
54
|
-
routes,
|
|
55
|
-
siteData,
|
|
56
|
-
siteLocaleDataSymbol,
|
|
57
|
-
updateHeadSymbol,
|
|
58
|
-
useLayouts,
|
|
59
|
-
usePageData,
|
|
60
|
-
usePageFrontmatter,
|
|
61
|
-
usePageHead,
|
|
62
|
-
usePageHeadTitle,
|
|
63
|
-
usePageLang,
|
|
64
|
-
usePageLayout,
|
|
65
|
-
useRedirects,
|
|
66
|
-
useRouteLocale,
|
|
67
|
-
useRoutes,
|
|
68
|
-
useSiteData,
|
|
69
|
-
useSiteLocaleData,
|
|
70
|
-
useUpdateHead,
|
|
71
|
-
withBase
|
|
72
|
-
};
|
|
1
|
+
import { A as useRedirects, C as usePage, D as usePageHead, E as usePageFrontmatter, F as useSiteData, I as useSiteLocale, L as useSiteLocaleData, M as useRoutePath, N as useRoutes, O as usePageLang, P as useSite, R as clientDataSymbol, S as useLayouts, T as usePageData, _ as onContentUpdated, a as ClientOnly, b as useHead, c as useRoute, d as resolveRoute, f as resolveRoutePath, g as useUpdateHead, h as updateHeadSymbol, i as Content, j as useRouteLocale, k as usePageLayout, l as useRouter, n as defineClientConfig, o as AutoLink, r as resolvers, s as RouteLink, t as withBase, u as resolveRouteFullPath, v as useData, w as usePageComponent, x as useLang, y as useFrontmatter, z as useClientData } from "./utils-CIxUK0LM.js";
|
|
2
|
+
import { c as constants_exports } from "./constants-COBTj3zj.js";
|
|
3
|
+
export { AutoLink, ClientOnly, Content, constants_exports as DEVTOOLS, RouteLink, clientDataSymbol, defineClientConfig, onContentUpdated, resolveRoute, resolveRouteFullPath, resolveRoutePath, resolvers, updateHeadSymbol, useClientData, useData, useFrontmatter, useHead, useLang, useLayouts, usePage, usePageComponent, usePageData, usePageFrontmatter, usePageHead, usePageLang, usePageLayout, useRedirects, useRoute, useRouteLocale, useRoutePath, useRouter, useRoutes, useSite, useSiteData, useSiteLocale, useSiteLocaleData, useUpdateHead, withBase };
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { a as INSPECTOR_STATE_SECTION_NAME, i as INSPECTOR_NODES, n as INSPECTOR_ID, o as PLUGIN_ID, r as INSPECTOR_LABEL, s as PLUGIN_LABEL, t as COMPONENT_STATE_TYPE } from "./constants-COBTj3zj.js";
|
|
2
|
+
import { watch } from "vue";
|
|
3
|
+
import { setupDevtoolsPlugin } from "@vue/devtools-api";
|
|
4
|
+
//#region src/devtools/setupDevtools.ts
|
|
5
|
+
const setupDevtools = (app, clientData) => {
|
|
6
|
+
setupDevtoolsPlugin({
|
|
7
|
+
app,
|
|
8
|
+
id: PLUGIN_ID,
|
|
9
|
+
label: PLUGIN_LABEL,
|
|
10
|
+
packageName: "@vuepress/client",
|
|
11
|
+
homepage: "https://vuepress.vuejs.org",
|
|
12
|
+
logo: "https://vuepress.vuejs.org/images/hero.png",
|
|
13
|
+
componentStateTypes: [COMPONENT_STATE_TYPE]
|
|
14
|
+
}, (api) => {
|
|
15
|
+
const clientDataEntries = Object.entries(clientData);
|
|
16
|
+
const clientDataKeys = Object.keys(clientData);
|
|
17
|
+
const clientDataValues = Object.values(clientData);
|
|
18
|
+
api.on.inspectComponent((payload) => {
|
|
19
|
+
payload.instanceData.state.push(...clientDataEntries.map(([name, item]) => ({
|
|
20
|
+
type: COMPONENT_STATE_TYPE,
|
|
21
|
+
editable: false,
|
|
22
|
+
key: name,
|
|
23
|
+
value: item.value
|
|
24
|
+
})));
|
|
25
|
+
});
|
|
26
|
+
api.addInspector({
|
|
27
|
+
id: INSPECTOR_ID,
|
|
28
|
+
label: INSPECTOR_LABEL,
|
|
29
|
+
icon: "article"
|
|
30
|
+
});
|
|
31
|
+
api.on.getInspectorTree((payload) => {
|
|
32
|
+
if (payload.inspectorId !== "org.vuejs.vuepress") return;
|
|
33
|
+
payload.rootNodes = Object.values(INSPECTOR_NODES).map((node) => ({
|
|
34
|
+
id: node.id,
|
|
35
|
+
label: node.label,
|
|
36
|
+
children: node.keys.map((key) => ({
|
|
37
|
+
id: key,
|
|
38
|
+
label: key
|
|
39
|
+
}))
|
|
40
|
+
}));
|
|
41
|
+
});
|
|
42
|
+
api.on.getInspectorState((payload) => {
|
|
43
|
+
if (payload.inspectorId !== "org.vuejs.vuepress") return;
|
|
44
|
+
const inspectorNode = INSPECTOR_NODES[payload.nodeId];
|
|
45
|
+
if (inspectorNode) {
|
|
46
|
+
payload.state = { [inspectorNode.label]: inspectorNode.keys.map((key) => ({
|
|
47
|
+
key,
|
|
48
|
+
value: clientData[key].value
|
|
49
|
+
})) };
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
if (clientDataKeys.includes(payload.nodeId)) payload.state = { [INSPECTOR_STATE_SECTION_NAME]: [{
|
|
53
|
+
key: payload.nodeId,
|
|
54
|
+
value: clientData[payload.nodeId].value
|
|
55
|
+
}] };
|
|
56
|
+
});
|
|
57
|
+
watch(clientDataValues, () => {
|
|
58
|
+
api.notifyComponentUpdate();
|
|
59
|
+
api.sendInspectorState(INSPECTOR_ID);
|
|
60
|
+
});
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
//#endregion
|
|
64
|
+
export { setupDevtools };
|
|
@@ -0,0 +1,405 @@
|
|
|
1
|
+
import { computed, defineAsyncComponent, defineComponent, h, inject, onMounted, onUnmounted, reactive, ref, shallowRef, toRef } from "vue";
|
|
2
|
+
import { dedupeHead, isLinkHttp, isLinkWithProtocol, isString, normalizeRoutePath, removeLeadingSlash, resolveLocalePath, splitPath } from "@vuepress/shared";
|
|
3
|
+
import { useRoute, useRoute as useRoute$1, useRouter, useRouter as useRouter$1 } from "vue-router";
|
|
4
|
+
import { redirects, routes } from "@internal/routes";
|
|
5
|
+
//#region src/composables/clientData.ts
|
|
6
|
+
/**
|
|
7
|
+
* Injection key for client data
|
|
8
|
+
*/
|
|
9
|
+
const clientDataSymbol = Symbol(__VUEPRESS_DEV__ ? "clientData" : "");
|
|
10
|
+
/**
|
|
11
|
+
* Returns client data
|
|
12
|
+
*/
|
|
13
|
+
const useClientData = () => {
|
|
14
|
+
const clientData = inject(clientDataSymbol);
|
|
15
|
+
if (!clientData) throw new Error("useClientData() is called without provider.");
|
|
16
|
+
return clientData;
|
|
17
|
+
};
|
|
18
|
+
//#endregion
|
|
19
|
+
//#region src/composables/clientDataUtils.ts
|
|
20
|
+
const useLayouts = () => useClientData().layouts;
|
|
21
|
+
const usePageComponent = () => useClientData().pageComponent;
|
|
22
|
+
const usePageData = () => useClientData().pageData;
|
|
23
|
+
const usePageFrontmatter = () => useClientData().pageFrontmatter;
|
|
24
|
+
const usePageHead = () => useClientData().pageHead;
|
|
25
|
+
const usePageLang = () => useClientData().pageLang;
|
|
26
|
+
const usePageLayout = () => useClientData().pageLayout;
|
|
27
|
+
const useRedirects = () => useClientData().redirects;
|
|
28
|
+
const useRouteLocale = () => useClientData().routeLocale;
|
|
29
|
+
const useRoutePath = () => useClientData().routePath;
|
|
30
|
+
const useRoutes = () => useClientData().routes;
|
|
31
|
+
const useSiteData = () => useClientData().siteData;
|
|
32
|
+
const useSiteLocaleData = () => useClientData().siteLocaleData;
|
|
33
|
+
const useData = useClientData;
|
|
34
|
+
const useFrontmatter = usePageFrontmatter;
|
|
35
|
+
const useHead = usePageHead;
|
|
36
|
+
const useLang = usePageLang;
|
|
37
|
+
const usePage = usePageData;
|
|
38
|
+
const useSite = useSiteData;
|
|
39
|
+
const useSiteLocale = useSiteLocaleData;
|
|
40
|
+
//#endregion
|
|
41
|
+
//#region src/internal/contentUpdatedCallbacks.ts
|
|
42
|
+
/**
|
|
43
|
+
* Global content updated callbacks
|
|
44
|
+
*/
|
|
45
|
+
const contentUpdatedCallbacks = /* @__PURE__ */ new Set();
|
|
46
|
+
//#endregion
|
|
47
|
+
//#region src/composables/onContentUpdated.ts
|
|
48
|
+
/**
|
|
49
|
+
* Register callback that is called every time the markdown content is updated
|
|
50
|
+
* in the DOM.
|
|
51
|
+
*/
|
|
52
|
+
const onContentUpdated = (fn) => {
|
|
53
|
+
contentUpdatedCallbacks.add(fn);
|
|
54
|
+
onUnmounted(() => {
|
|
55
|
+
contentUpdatedCallbacks.delete(fn);
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
//#endregion
|
|
59
|
+
//#region src/composables/updateHead.ts
|
|
60
|
+
/**
|
|
61
|
+
* Injection key for `updateHead` util
|
|
62
|
+
*/
|
|
63
|
+
const updateHeadSymbol = Symbol(__VUEPRESS_DEV__ ? "updateHead" : "");
|
|
64
|
+
/**
|
|
65
|
+
* Returns the `updateHead` util
|
|
66
|
+
*/
|
|
67
|
+
const useUpdateHead = () => {
|
|
68
|
+
const updateHead = inject(updateHeadSymbol);
|
|
69
|
+
if (!updateHead) throw new Error("useUpdateHead() is called without provider.");
|
|
70
|
+
return updateHead;
|
|
71
|
+
};
|
|
72
|
+
//#endregion
|
|
73
|
+
//#region src/internal/routes.ts
|
|
74
|
+
/**
|
|
75
|
+
* Global redirects ref
|
|
76
|
+
*/
|
|
77
|
+
const redirects$1 = shallowRef(redirects);
|
|
78
|
+
/**
|
|
79
|
+
* Global routes ref
|
|
80
|
+
*/
|
|
81
|
+
const routes$1 = shallowRef(routes);
|
|
82
|
+
if (__VUEPRESS_DEV__ && (import.meta.webpackHot || import.meta.hot)) {
|
|
83
|
+
__VUE_HMR_RUNTIME__.updateRedirects = (data) => {
|
|
84
|
+
redirects$1.value = data;
|
|
85
|
+
};
|
|
86
|
+
__VUE_HMR_RUNTIME__.updateRoutes = (data) => {
|
|
87
|
+
routes$1.value = data;
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
//#endregion
|
|
91
|
+
//#region src/router/resolveRoutePath.ts
|
|
92
|
+
/**
|
|
93
|
+
* Resolve route path with given raw path
|
|
94
|
+
*/
|
|
95
|
+
const resolveRoutePath = (pathname, currentPath) => {
|
|
96
|
+
const normalizedRoutePath = normalizeRoutePath(pathname, currentPath);
|
|
97
|
+
if (routes$1.value[normalizedRoutePath]) return normalizedRoutePath;
|
|
98
|
+
const encodedRoutePath = encodeURI(normalizedRoutePath);
|
|
99
|
+
if (routes$1.value[encodedRoutePath]) return encodedRoutePath;
|
|
100
|
+
const redirectedRoutePath = redirects$1.value[normalizedRoutePath] || redirects$1.value[encodedRoutePath];
|
|
101
|
+
if (redirectedRoutePath) return redirectedRoutePath;
|
|
102
|
+
return normalizedRoutePath;
|
|
103
|
+
};
|
|
104
|
+
//#endregion
|
|
105
|
+
//#region src/router/resolveRoute.ts
|
|
106
|
+
/**
|
|
107
|
+
* Resolve route with given path
|
|
108
|
+
*/
|
|
109
|
+
const resolveRoute = (path, currentPath) => {
|
|
110
|
+
const { pathname, hashAndQueries } = splitPath(path);
|
|
111
|
+
const routePath = resolveRoutePath(pathname, currentPath);
|
|
112
|
+
const routeFullPath = routePath + hashAndQueries;
|
|
113
|
+
if (!routes$1.value[routePath]) return {
|
|
114
|
+
...routes$1.value["/404.html"],
|
|
115
|
+
path: routeFullPath,
|
|
116
|
+
notFound: true
|
|
117
|
+
};
|
|
118
|
+
return {
|
|
119
|
+
...routes$1.value[routePath],
|
|
120
|
+
path: routeFullPath,
|
|
121
|
+
notFound: false
|
|
122
|
+
};
|
|
123
|
+
};
|
|
124
|
+
//#endregion
|
|
125
|
+
//#region src/router/resolveRouteFullPath.ts
|
|
126
|
+
/**
|
|
127
|
+
* Resolve route full path with given raw path
|
|
128
|
+
*/
|
|
129
|
+
const resolveRouteFullPath = (path, currentPath) => {
|
|
130
|
+
const { pathname, hashAndQueries } = splitPath(path);
|
|
131
|
+
return resolveRoutePath(pathname, currentPath) + hashAndQueries;
|
|
132
|
+
};
|
|
133
|
+
//#endregion
|
|
134
|
+
//#region src/components/RouteLink.ts
|
|
135
|
+
/**
|
|
136
|
+
* Forked from https://github.com/vuejs/router/blob/941b2131e80550009e5221d4db9f366b1fea3fd5/packages/router/src/RouterLink.ts#L293
|
|
137
|
+
*/
|
|
138
|
+
const guardEvent = (event) => {
|
|
139
|
+
if (event.metaKey || event.altKey || event.ctrlKey || event.shiftKey) return;
|
|
140
|
+
if (event.defaultPrevented) return;
|
|
141
|
+
if (event.button !== void 0 && event.button !== 0) return;
|
|
142
|
+
if (event.currentTarget) {
|
|
143
|
+
if (event.currentTarget.getAttribute("target")?.match(/\b_blank\b/i)) return;
|
|
144
|
+
}
|
|
145
|
+
event.preventDefault();
|
|
146
|
+
return true;
|
|
147
|
+
};
|
|
148
|
+
/**
|
|
149
|
+
* Component to render a link to another route.
|
|
150
|
+
*
|
|
151
|
+
* It's similar to `RouterLink` in `vue-router`, but more lightweight.
|
|
152
|
+
*
|
|
153
|
+
* It's recommended to use `RouteLink` in VuePress.
|
|
154
|
+
*/
|
|
155
|
+
const RouteLink = defineComponent({
|
|
156
|
+
name: "RouteLink",
|
|
157
|
+
props: {
|
|
158
|
+
/**
|
|
159
|
+
* The route path to link to
|
|
160
|
+
*/
|
|
161
|
+
to: {
|
|
162
|
+
type: String,
|
|
163
|
+
required: true
|
|
164
|
+
},
|
|
165
|
+
/**
|
|
166
|
+
* Whether the link is active to have an active class
|
|
167
|
+
*
|
|
168
|
+
* Notice that the active status is not automatically determined according to the current route.
|
|
169
|
+
*/
|
|
170
|
+
active: Boolean,
|
|
171
|
+
/**
|
|
172
|
+
* The class to add when the link is active
|
|
173
|
+
*/
|
|
174
|
+
activeClass: {
|
|
175
|
+
type: String,
|
|
176
|
+
default: "route-link-active"
|
|
177
|
+
}
|
|
178
|
+
},
|
|
179
|
+
slots: Object,
|
|
180
|
+
setup(props, { slots }) {
|
|
181
|
+
const router = useRouter();
|
|
182
|
+
const route = useRoute();
|
|
183
|
+
const path = computed(() => props.to.startsWith("#") || props.to.startsWith("?") ? props.to : `${__VUEPRESS_BASE__}${resolveRouteFullPath(props.to, route.path).substring(1)}`);
|
|
184
|
+
return () => h("a", {
|
|
185
|
+
class: ["route-link", { [props.activeClass]: props.active }],
|
|
186
|
+
href: path.value,
|
|
187
|
+
onClick: (event = {}) => {
|
|
188
|
+
if (guardEvent(event)) router.push(props.to).catch();
|
|
189
|
+
}
|
|
190
|
+
}, slots.default());
|
|
191
|
+
}
|
|
192
|
+
});
|
|
193
|
+
//#endregion
|
|
194
|
+
//#region src/components/AutoLink.ts
|
|
195
|
+
/**
|
|
196
|
+
* Component to render a link automatically according to the link type
|
|
197
|
+
*
|
|
198
|
+
* - If the link is internal, it will be rendered as a `<RouteLink>`
|
|
199
|
+
* - If the link is external, it will be rendered as a normal `<a>` tag
|
|
200
|
+
*/
|
|
201
|
+
const AutoLink = defineComponent({
|
|
202
|
+
name: "AutoLink",
|
|
203
|
+
props: { config: {
|
|
204
|
+
type: Object,
|
|
205
|
+
required: true
|
|
206
|
+
} },
|
|
207
|
+
slots: Object,
|
|
208
|
+
setup(props, { slots }) {
|
|
209
|
+
const config = toRef(props, "config");
|
|
210
|
+
const route = useRoute();
|
|
211
|
+
const siteData = useSiteData();
|
|
212
|
+
const withProtocol = computed(() => isLinkWithProtocol(config.value.link));
|
|
213
|
+
const linkTarget = computed(() => config.value.target || (withProtocol.value ? "_blank" : void 0));
|
|
214
|
+
const isBlankTarget = computed(() => linkTarget.value === "_blank");
|
|
215
|
+
const isInternal = computed(() => !withProtocol.value && !isBlankTarget.value);
|
|
216
|
+
const linkRel = computed(() => config.value.rel || (isBlankTarget.value ? "noopener noreferrer" : null));
|
|
217
|
+
const linkAriaLabel = computed(() => config.value.ariaLabel ?? config.value.text);
|
|
218
|
+
const shouldBeActiveInSubpath = computed(() => {
|
|
219
|
+
if (config.value.exact) return false;
|
|
220
|
+
const localePaths = Object.keys(siteData.value.locales);
|
|
221
|
+
return localePaths.length ? localePaths.every((key) => key !== config.value.link) : config.value.link !== "/";
|
|
222
|
+
});
|
|
223
|
+
const isActive = computed(() => {
|
|
224
|
+
if (!isInternal.value) return false;
|
|
225
|
+
if (config.value.activeMatch) return (config.value.activeMatch instanceof RegExp ? config.value.activeMatch : new RegExp(config.value.activeMatch, "u")).test(route.path);
|
|
226
|
+
if (shouldBeActiveInSubpath.value) return route.path.startsWith(config.value.link);
|
|
227
|
+
return route.path === config.value.link;
|
|
228
|
+
});
|
|
229
|
+
return () => {
|
|
230
|
+
const { before, after, default: defaultSlot } = slots;
|
|
231
|
+
const content = defaultSlot?.(config.value) ?? [
|
|
232
|
+
before?.(config.value),
|
|
233
|
+
config.value.text,
|
|
234
|
+
after?.(config.value)
|
|
235
|
+
];
|
|
236
|
+
return isInternal.value ? h(RouteLink, {
|
|
237
|
+
"class": "auto-link",
|
|
238
|
+
"to": config.value.link,
|
|
239
|
+
"active": isActive.value,
|
|
240
|
+
"aria-label": linkAriaLabel.value
|
|
241
|
+
}, () => content) : h("a", {
|
|
242
|
+
"class": "auto-link external-link",
|
|
243
|
+
"href": config.value.link,
|
|
244
|
+
"aria-label": linkAriaLabel.value,
|
|
245
|
+
"rel": linkRel.value,
|
|
246
|
+
"target": linkTarget.value
|
|
247
|
+
}, content);
|
|
248
|
+
};
|
|
249
|
+
}
|
|
250
|
+
});
|
|
251
|
+
//#endregion
|
|
252
|
+
//#region src/components/ClientOnly.ts
|
|
253
|
+
/**
|
|
254
|
+
* Wrapper component that only renders its content on the client side and skips server side rendering
|
|
255
|
+
*
|
|
256
|
+
* Since vue 3.5, you can try the new `data-allow-mismatch` attribute instead of `<ClientOnly>` component in some cases to avoid hydration mismatch.
|
|
257
|
+
*
|
|
258
|
+
* @see https://blog.vuejs.org/posts/vue-3-5#data-allow-mismatch
|
|
259
|
+
*/
|
|
260
|
+
const ClientOnly = defineComponent({
|
|
261
|
+
name: "ClientOnly",
|
|
262
|
+
setup(_, ctx) {
|
|
263
|
+
const isMounted = ref(false);
|
|
264
|
+
onMounted(() => {
|
|
265
|
+
isMounted.value = true;
|
|
266
|
+
});
|
|
267
|
+
return () => isMounted.value ? ctx.slots.default?.() : null;
|
|
268
|
+
}
|
|
269
|
+
});
|
|
270
|
+
//#endregion
|
|
271
|
+
//#region src/components/Content.ts
|
|
272
|
+
/**
|
|
273
|
+
* Execute all callbacks registered via `onContentUpdated`.
|
|
274
|
+
*
|
|
275
|
+
* @internal
|
|
276
|
+
*/
|
|
277
|
+
const runContentUpdatedCallbacks = (reason) => {
|
|
278
|
+
contentUpdatedCallbacks.forEach((fn) => fn(reason));
|
|
279
|
+
};
|
|
280
|
+
/**
|
|
281
|
+
* Markdown rendered content
|
|
282
|
+
*/
|
|
283
|
+
const Content = defineComponent({
|
|
284
|
+
name: "Content",
|
|
285
|
+
props: { path: {
|
|
286
|
+
type: String,
|
|
287
|
+
required: false,
|
|
288
|
+
default: ""
|
|
289
|
+
} },
|
|
290
|
+
setup(props) {
|
|
291
|
+
const pageComponent = usePageComponent();
|
|
292
|
+
const ContentComponent = computed(() => {
|
|
293
|
+
if (!props.path) return pageComponent.value;
|
|
294
|
+
const route = resolveRoute(props.path);
|
|
295
|
+
return defineAsyncComponent(async () => route.loader().then((m) => m.default));
|
|
296
|
+
});
|
|
297
|
+
return () => h(ContentComponent.value, {
|
|
298
|
+
onVnodeMounted: () => {
|
|
299
|
+
runContentUpdatedCallbacks("mounted");
|
|
300
|
+
},
|
|
301
|
+
onVnodeUpdated: () => {
|
|
302
|
+
runContentUpdatedCallbacks("updated");
|
|
303
|
+
},
|
|
304
|
+
onVnodeBeforeUnmount: () => {
|
|
305
|
+
runContentUpdatedCallbacks("beforeUnmount");
|
|
306
|
+
}
|
|
307
|
+
});
|
|
308
|
+
}
|
|
309
|
+
});
|
|
310
|
+
//#endregion
|
|
311
|
+
//#region src/constants.ts
|
|
312
|
+
/**
|
|
313
|
+
* Name of the default layout
|
|
314
|
+
*/
|
|
315
|
+
const LAYOUT_NAME_DEFAULT = "Layout";
|
|
316
|
+
//#endregion
|
|
317
|
+
//#region src/resolvers.ts
|
|
318
|
+
/**
|
|
319
|
+
* Resolver methods to get global computed
|
|
320
|
+
*
|
|
321
|
+
* Users can override corresponding method for advanced customization
|
|
322
|
+
*
|
|
323
|
+
* @experimental - This is an experimental API and may be changed in minor versions
|
|
324
|
+
*/
|
|
325
|
+
const resolvers = reactive({
|
|
326
|
+
/**
|
|
327
|
+
* Resolve layouts component map
|
|
328
|
+
*/
|
|
329
|
+
resolveLayouts: (clientConfigs) => clientConfigs.reduce((prev, item) => ({
|
|
330
|
+
...prev,
|
|
331
|
+
...item.layouts
|
|
332
|
+
}), {}),
|
|
333
|
+
/**
|
|
334
|
+
* Merge the head config in frontmatter and site locale
|
|
335
|
+
*
|
|
336
|
+
* Frontmatter should take priority over site locale
|
|
337
|
+
*/
|
|
338
|
+
resolvePageHead: (pageHeadTitle, pageFrontmatter, siteLocaleDate) => {
|
|
339
|
+
const description = isString(pageFrontmatter.description) ? pageFrontmatter.description : siteLocaleDate.description;
|
|
340
|
+
return dedupeHead([
|
|
341
|
+
...Array.isArray(pageFrontmatter.head) ? pageFrontmatter.head : [],
|
|
342
|
+
...siteLocaleDate.head,
|
|
343
|
+
[
|
|
344
|
+
"title",
|
|
345
|
+
{},
|
|
346
|
+
pageHeadTitle
|
|
347
|
+
],
|
|
348
|
+
["meta", {
|
|
349
|
+
name: "description",
|
|
350
|
+
content: description
|
|
351
|
+
}]
|
|
352
|
+
]);
|
|
353
|
+
},
|
|
354
|
+
/**
|
|
355
|
+
* Resolve the content of page head title
|
|
356
|
+
*
|
|
357
|
+
* It would be used as the content of the `<title>` tag
|
|
358
|
+
*/
|
|
359
|
+
resolvePageHeadTitle: (pageData, siteLocaleDate) => [pageData.title, siteLocaleDate.title].filter((item) => !!item).join(" | "),
|
|
360
|
+
/**
|
|
361
|
+
* Resolve page language from page data
|
|
362
|
+
*
|
|
363
|
+
* It would be used as the `lang` attribute of `<html>` tag
|
|
364
|
+
*/
|
|
365
|
+
resolvePageLang: (pageData, siteLocaleData) => pageData.lang || siteLocaleData.lang || "en-US",
|
|
366
|
+
/**
|
|
367
|
+
* Resolve layout component of current page
|
|
368
|
+
*/
|
|
369
|
+
resolvePageLayout: (pageData, layouts) => {
|
|
370
|
+
const layoutName = isString(pageData.frontmatter.layout) ? pageData.frontmatter.layout : LAYOUT_NAME_DEFAULT;
|
|
371
|
+
if (!layouts[layoutName]) throw new Error(`[vuepress] Cannot resolve layout: ${layoutName}`);
|
|
372
|
+
return layouts[layoutName];
|
|
373
|
+
},
|
|
374
|
+
/**
|
|
375
|
+
* Resolve locale path according to route path and locales config
|
|
376
|
+
*/
|
|
377
|
+
resolveRouteLocale: (locales, routePath) => resolveLocalePath(locales, decodeURI(routePath)),
|
|
378
|
+
/**
|
|
379
|
+
* Resolve site data for specific locale
|
|
380
|
+
*
|
|
381
|
+
* It would merge the locales fields to the root fields
|
|
382
|
+
*/
|
|
383
|
+
resolveSiteLocaleData: ({ base, locales, ...siteData }, routeLocale) => ({
|
|
384
|
+
...siteData,
|
|
385
|
+
...locales[routeLocale],
|
|
386
|
+
head: [...locales[routeLocale]?.head ?? [], ...siteData.head]
|
|
387
|
+
})
|
|
388
|
+
});
|
|
389
|
+
//#endregion
|
|
390
|
+
//#region src/utils/defineClientConfig.ts
|
|
391
|
+
/**
|
|
392
|
+
* A helper function to help you define vuepress client config file
|
|
393
|
+
*/
|
|
394
|
+
const defineClientConfig = (clientConfig = {}) => clientConfig;
|
|
395
|
+
//#endregion
|
|
396
|
+
//#region src/utils/withBase.ts
|
|
397
|
+
/**
|
|
398
|
+
* Prefix url with site base
|
|
399
|
+
*/
|
|
400
|
+
const withBase = (url) => {
|
|
401
|
+
if (isLinkHttp(url)) return url;
|
|
402
|
+
return `${__VUEPRESS_BASE__}${removeLeadingSlash(url)}`;
|
|
403
|
+
};
|
|
404
|
+
//#endregion
|
|
405
|
+
export { useRedirects as A, usePage as C, usePageHead as D, usePageFrontmatter as E, useSiteData as F, useSiteLocale as I, useSiteLocaleData as L, useRoutePath as M, useRoutes as N, usePageLang as O, useSite as P, clientDataSymbol as R, useLayouts as S, usePageData as T, onContentUpdated as _, ClientOnly as a, useHead as b, useRoute$1 as c, resolveRoute as d, resolveRoutePath as f, useUpdateHead as g, updateHeadSymbol as h, Content as i, useRouteLocale as j, usePageLayout as k, useRouter$1 as l, routes$1 as m, defineClientConfig as n, AutoLink as o, redirects$1 as p, resolvers as r, RouteLink as s, withBase as t, resolveRouteFullPath as u, useData as v, usePageComponent as w, useLang as x, useFrontmatter as y, useClientData as z };
|
package/package.json
CHANGED
|
@@ -1,22 +1,30 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vuepress/client",
|
|
3
|
-
"version": "2.0.0-rc.
|
|
3
|
+
"version": "2.0.0-rc.30",
|
|
4
4
|
"description": "Client package of VuePress",
|
|
5
5
|
"keywords": [
|
|
6
|
-
"
|
|
7
|
-
"
|
|
6
|
+
"client",
|
|
7
|
+
"vuepress"
|
|
8
8
|
],
|
|
9
9
|
"homepage": "https://github.com/vuepress",
|
|
10
10
|
"bugs": {
|
|
11
11
|
"url": "https://github.com/vuepress/core/issues"
|
|
12
12
|
},
|
|
13
|
+
"license": "MIT",
|
|
14
|
+
"author": "meteorlxy",
|
|
13
15
|
"repository": {
|
|
14
16
|
"type": "git",
|
|
15
17
|
"url": "git+https://github.com/vuepress/core.git"
|
|
16
18
|
},
|
|
17
|
-
"
|
|
18
|
-
|
|
19
|
+
"files": [
|
|
20
|
+
"dist",
|
|
21
|
+
"templates",
|
|
22
|
+
"types.d.ts"
|
|
23
|
+
],
|
|
19
24
|
"type": "module",
|
|
25
|
+
"main": "./dist/index.js",
|
|
26
|
+
"module": "./dist/index.js",
|
|
27
|
+
"types": "./dist/index.d.ts",
|
|
20
28
|
"exports": {
|
|
21
29
|
".": "./dist/index.js",
|
|
22
30
|
"./app": "./dist/app.js",
|
|
@@ -24,50 +32,38 @@
|
|
|
24
32
|
"./templates/*": "./templates/*",
|
|
25
33
|
"./types": "./types.d.ts"
|
|
26
34
|
},
|
|
27
|
-
"main": "./dist/index.js",
|
|
28
|
-
"module": "./dist/index.js",
|
|
29
|
-
"types": "./dist/index.d.ts",
|
|
30
|
-
"files": [
|
|
31
|
-
"dist",
|
|
32
|
-
"templates",
|
|
33
|
-
"types.d.ts"
|
|
34
|
-
],
|
|
35
|
-
"dependencies": {
|
|
36
|
-
"@vue/devtools-api": "^6.5.1",
|
|
37
|
-
"@vueuse/core": "^10.7.2",
|
|
38
|
-
"vue": "^3.4.15",
|
|
39
|
-
"vue-router": "^4.2.5",
|
|
40
|
-
"@vuepress/shared": "2.0.0-rc.3"
|
|
41
|
-
},
|
|
42
35
|
"publishConfig": {
|
|
43
36
|
"access": "public"
|
|
44
37
|
},
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
38
|
+
"dependencies": {
|
|
39
|
+
"@vue/devtools-api": "^8.1.1",
|
|
40
|
+
"@vue/devtools-kit": "^8.1.1",
|
|
41
|
+
"vue": "^3.5.34",
|
|
42
|
+
"vue-router": "^5.0.6",
|
|
43
|
+
"@vuepress/shared": "2.0.0-rc.30"
|
|
44
|
+
},
|
|
45
|
+
"tsdown": {
|
|
46
|
+
"deps": {
|
|
47
|
+
"neverBundle": [
|
|
48
|
+
"@internal/clientConfigs",
|
|
49
|
+
"@internal/routes",
|
|
50
|
+
"@internal/siteData",
|
|
51
|
+
"@internal/userStyle"
|
|
52
|
+
]
|
|
53
|
+
},
|
|
54
|
+
"dts": true,
|
|
51
55
|
"entry": [
|
|
52
56
|
"./src/app.ts",
|
|
53
57
|
"./src/index.ts"
|
|
54
58
|
],
|
|
55
|
-
"
|
|
56
|
-
|
|
57
|
-
"@internal/layoutComponents",
|
|
58
|
-
"@internal/routes",
|
|
59
|
-
"@internal/siteData"
|
|
60
|
-
],
|
|
61
|
-
"format": [
|
|
62
|
-
"esm"
|
|
63
|
-
],
|
|
59
|
+
"fixedExtension": false,
|
|
60
|
+
"format": "esm",
|
|
64
61
|
"outDir": "./dist",
|
|
65
|
-
"
|
|
66
|
-
"target": "es2022",
|
|
62
|
+
"target": "es2023",
|
|
67
63
|
"tsconfig": "./tsconfig.dts.json"
|
|
68
64
|
},
|
|
69
65
|
"scripts": {
|
|
70
|
-
"build": "
|
|
66
|
+
"build": "tsdown",
|
|
71
67
|
"clean": "rimraf dist"
|
|
72
68
|
}
|
|
73
69
|
}
|
package/types.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/naming-convention, no-underscore-dangle */
|
|
1
2
|
declare const __VUEPRESS_VERSION__: string
|
|
2
3
|
declare const __VUEPRESS_BASE__: string
|
|
3
4
|
declare const __VUEPRESS_DEV__: boolean
|
|
4
5
|
declare const __VUEPRESS_SSR__: boolean
|
|
5
|
-
declare const __VUE_HMR_RUNTIME__: Record<string,
|
|
6
|
-
declare const __VUE_OPTIONS_API__: boolean
|
|
6
|
+
declare const __VUE_HMR_RUNTIME__: Record<string, unknown>
|
|
7
7
|
declare const __VUE_PROD_DEVTOOLS__: boolean
|