Skip to content

Commit 4bf7c89

Browse files
committed
Merge branch 'main' into esm-browser.prod
2 parents c637147 + d7a4719 commit 4bf7c89

File tree

158 files changed

+8506
-3227
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

158 files changed

+8506
-3227
lines changed

.github/contributing.md

+47-36
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ Hi! I'm really excited that you are interested in contributing to Vue Router. Be
1717

1818
## Pull Request Guidelines
1919

20-
- Checkout a topic branch from a base branch, e.g. `main`, and merge back against that branch.
20+
- Check out a topic branch from a base branch, e.g. `main`, and merge back against that branch.
2121

2222
- If adding a new feature:
2323

@@ -26,7 +26,7 @@ Hi! I'm really excited that you are interested in contributing to Vue Router. Be
2626

2727
- If fixing bug:
2828

29-
- If you are resolving a special issue, add `(fix #xxxx[,#xxxx])` (#xxxx is the issue id) in your PR title for a better release log, e.g. `update entities encoding/decoding (fix #3899)`.
29+
- If you are resolving a particular issue, add `(fix #xxxx[,#xxxx])` (#xxxx is the issue id) in your PR title for a better release log, e.g. `update entities encoding/decoding (fix #3899)`.
3030
- Provide a detailed description of the bug in the PR. Live demo preferred.
3131
- Add appropriate test coverage if applicable. You can check the coverage of your code addition by running `pnpm test --coverage`.
3232

@@ -48,7 +48,7 @@ After cloning the repo, run:
4848
pnpm install # install the dependencies of the project
4949
```
5050

51-
A high level overview of tools used:
51+
A high-level overview of tools used:
5252

5353
- [TypeScript](https://www.typescriptlang.org/) as the development language
5454
- [Rollup](https://rollupjs.org) for bundling
@@ -63,7 +63,7 @@ The `build` script builds vue-router
6363

6464
### `pnpm play`
6565

66-
The `play` scripts starts a playground project located at `playground/` that allows you to test things on a browser.
66+
The `play` script starts a playground project located at `playground/`, allowing you to test things on a browser.
6767

6868
```bash
6969
pnpm play
@@ -91,66 +91,77 @@ $ pnpm jest --watch
9191
Vue Router source code can be found in the `src` directory:
9292

9393
- `src/history`: history implementations that are instantiable with `create*History()`. This folder contains code related to using the [History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API).
94-
- `src/matcher`: RouteMatcher implementation. Contains the code that transforms paths like `/users/:id` into regexps and handle the transformation of locations like `{ name: 'UserDetail', params: { id: '2' } }` to strings. It contains path ranking logic and the part of dynamic routing that concerns matching urls in the right order.
95-
- `src/utils`: contains small utility functions that are used across other sections of the router but are not contained by them.
96-
- `src/router`: contains the router creation, navigation execution, using the matcher, the history implementation. It runs navigation guards.
97-
- `src/location`: helpers related to route location and urls
98-
- `src/encoding`: helpers related to url encoding
94+
- `src/matcher`: RouteMatcher implementation. Contains the code that transforms paths like `/users/:id` into regexps and handles the transformation of locations like `{ name: 'UserDetail', params: { id: '2' } }` to strings. It contains path ranking logic and the part of dynamic routing that concerns matching URLs in the correct order.
95+
- `src/utils`: contains small utility functions used across other router
96+
- `src/router`: contains the router creation, navigation execution, matcher use, and history implementation. It runs navigation guards.
97+
- `src/location`: helpers related to route location and URLs
98+
- `src/encoding`: helpers related to URL encoding
9999
- `src/errors`: different internal and external errors with their messages
100-
- `src/index`: contains all public API as exports.
101-
- `src/types`: contains global types that are used across multiple sections of the router.
100+
- `src/index` contains all public APIs as exports.
101+
- `src/types`: contains global types used across multiple router sections.
102102

103103
## Contributing Tests
104104

105105
Unit tests are located inside `__tests__`. Consult the [Jest docs](https://jestjs.io/docs/en/using-matchers) and existing test cases for how to write new test specs. Here are some additional guidelines:
106106

107107
- Use the minimal API needed for a test case. For example, if a test can be written without involving the reactivity system or a component, it should be written so. This limits the test's exposure to changes in unrelated parts and makes it more stable.
108-
- Use the minimal API needed for a test case. For example, if a test concerns the `router-link` component, don't create a router instance, mock the needed properties instead.
108+
- Use the minimal API needed for a test case. For example, if a test concerns the `router-link` component, don't create a router instance, mock the required properties instead.
109109
- Write a unit test whenever possible
110-
- If a test is specific to a browser, create an e2e (end to end) test and make sure to indicate it on the test
110+
- If a test is specific to a browser, create an e2e (end-to-end) test and make sure to indicate it on the test
111111

112112
## Contributing Docs
113113

114-
Currently, all the docs can be found in `packages/docs`. It contains the English markdown files while translation(s) are stored in their corresponding `<lang>` sub-folder(s):
114+
All the documentation files can be found in `packages/docs`. It contains the English markdown files while translation(s) are stored in their corresponding `<lang>` sub-folder(s):
115115

116116
- [`zh`](https://github.com/vuejs/router/tree/main/packages/docs/zh): Chinese translation.
117117

118-
Besides that, the `.vitepress` sub-folder is used to put the config and theme, including the i18n information.
118+
Besides that, the `.vitepress` sub-folder contains the config and theme, including the i18n information.
119119

120-
Consider the following two options in order to contribute to the translations:
120+
Contributing to the English docs is the same as contributing to the source code. You can create a pull request to our GitHub repo. However, if you would like to contribute to the translations, there are two options and some extra steps to follow:
121121

122122
### Translate in a `<lang>` sub-folder and host it on our official repo
123123

124-
If you want to start translating the docs in a new language:
124+
If you want to start translating the docs in a _new_ language:
125125

126126
1. Create the corresponding `<lang>` sub-folder for your translation.
127-
2. Modify the i18n config in `.vitepress` sub-folder.
127+
2. Modify the i18n configuration in the `.vitepress` sub-folder.
128128
3. Translate the docs and run the doc site to self-test locally.
129-
4. Once you have done all above, create a pull request to our GitHub repo.
129+
4. Create a checkpoint for your language by running `pnpm run docs:translation:update <lang> [<commit>]`. A checkpoint is the hash and date of the latest commit when you do the translation. The checkpoint information is stored in the status file `packages/docs/.vitepress/translation-status.json`. _It's crucial for long-term maintenance since all the further translation sync-ups are based on their previous checkpoints._ Usually, you can skip the commit argument because the default value is `main`.
130+
5. Commit all the changes and create a pull request to our GitHub repo.
130131

131-
If you want to maintain a existing translation:
132+
We will have a paragraph at the top of each translation page that shows the translation status. That way, users can quickly determine if the translation is up-to-date or lags behind the English version.
132133

133-
1. (Repo permission required) First of all, make sure there is a _checkpoint_ branch for the language. Usually it's named as `docs-sync-<lang>`. Notice that:
134-
- This branch is always synced to the commit of the original docs that the latest translation of your language is corresponding to. Like `docs-sync-zh` is always to the commit of the original docs that the latest Chinese translation is corresponding to.
135-
- Technically, this checkpoint branch should be only updated if the translation is synced to a nearer commit of the original docs. Usually the commit is the HEAD of the `main` branch at that moment.
136-
2. See what translation you need to do to sync up with the original docs. There are 2 popular ways:
137-
- Git diff command: e.g. `git diff docs-sync-zh..main packages/docs # > debug.log`, or
138-
- GitHub Compare page: e.g. https://github.com/vuejs/router/compare/docs-sync-zh...main (only see the changes in `packages/docs/*`)
139-
3. Create your own branch and start the translation update, following the diff or compare.
140-
4. Once you have done all above, create a pull request to our GitHub repo.
141-
- It's highly recommended to commit with message like `docs(<lang>): sync update to <the-latest-commit>`. e.g. `docs(zh): sync update to e008551`.
142-
5. (Repo permission required) **VERY IMPORTANT**: after the pull request is merged, for the future batch of sync-up, do another merge from the latest commit at that moment to the checkpoint branch. e.g. merge commit `e008551` to branch `docs-sync-zh`.
134+
Speaking of the up-to-date translation, we also need good long-term maintenance for every language. If you want to _update_ an existing translation:
143135

144-
For more real examples, please check out [all the PRs with title "docs(zh): sync" after 2023-01-01](https://github.com/vuejs/router/pulls?q=is%3Apr+created%3A%3E2023-01-01+docs%28zh%29+sync).
136+
1. See what translation you need to sync up with the original docs. There are two popular ways:
137+
1. Via the [GitHub Compare](https://github.com/vuejs/router/compare/) page, only see the changes in `packages/docs/*` from the checkpoint hash to `main` branch. You can find the checkpoint hash for your language via the translation status file `packages/docs/.vitepress/translation-status.json`. The compare page can be directly opened with the hash as part of the URL, e.g. https://github.com/vuejs/router/compare/e008551...main
138+
2. Via a local command: `pnpm run docs:translation:compare <lang> [<commit>]`.
139+
2. Create your own branch and start the translation update, following the previous comparison.
140+
3. Create a checkpoint for your language by running `pnpm run docs:translation:update <lang> [<commit>]`.
141+
4. Commit all the changes and create a pull request to our GitHub repo.
142+
143+
<!-- TODO: add an example once we have got one -->
145144

146145
### Self-host the translation
147146

148-
You can also host the translation on your own. To create one, just simply fork our GitHub repo and change the content and site config in `packages/docs`. To long-term maintain it, we _highly recommend_ a similar way that we do above for our officially hosted translations:
147+
You can also host the translation on your own. To create one, fork our GitHub repo and change the content and site config in `packages/docs`. To long-term maintain it, we _highly recommend_ a similar way that we do above for our officially hosted translations:
148+
149+
- Ensure you maintain the _checkpoint_ properly. Also, ensure the _translation status_ is well-displayed on the top of each translation page.
150+
- Utilize the diff result between the latest official repository and your own checkpoint to guide your translation.
151+
152+
Tip: you can add the official repo as a remote to your forked repo. This way, you can still run `pnpm run docs:translation:update <lang> [<commit>]` and `npm run docs:translation:compare <lang> [<commit>]` to get the checkpoint and diff result:
149153

150-
1. Ensure you create a _checkpoint branch_ (for example, a branch named sync). This branch should always align with the commit of the original documentation that corresponds to your most recent translation.
151-
2. Utilize the diff result between the latest official repository and your own by using the git diff command or the GitHub Compare page to guide your translation.
152-
3. Complete the translation process.
153-
4. Update the _checkpoint branch_ accordingly.
154+
```bash
155+
# prepare the upstream remote
156+
git remote add upstream [email protected]:vuejs/router.git
157+
git fetch upstream main
158+
159+
# set the checkpoint
160+
pnpm run docs:translation:update <lang> upstream/main
161+
162+
# get the diff result
163+
pnpm run docs:translation:compare <lang> upstream/main
164+
```
154165

155166
<!-- TODO: add an example once we have got one -->
156167

.github/workflows/test.yml

+3-1
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,9 @@ jobs:
4242
# e2e tests that that run locally
4343
- run: pnpm run -r test:e2e:ci
4444

45-
- uses: codecov/codecov-action@v2
45+
- uses: codecov/codecov-action@v4
46+
with:
47+
token: ${{ secrets.CODECOV_TOKEN }}
4648

4749
# - name: 'Start BrowserStackLocal Tunnel'
4850
# uses: 'browserstack/github-actions/setup-local@master'

README.md

+5-15
Original file line numberDiff line numberDiff line change
@@ -12,16 +12,6 @@ Vue Router is part of the Vue Ecosystem and is an MIT-licensed open source proje
1212

1313
<!--sponsors start-->
1414

15-
<h4 align="center">Gold Sponsors</h4>
16-
<p align="center">
17-
<a href="https://vuejobs.com/?utm_source=vuerouter&utm_campaign=sponsor" target="_blank" rel="noopener noreferrer">
18-
<picture>
19-
<source srcset="https://posva-sponsors.pages.dev/logos/vuejobs.svg" media="(prefers-color-scheme: dark)" height="72px" alt="VueJobs" />
20-
<img src="https://posva-sponsors.pages.dev/logos/vuejobs.svg" height="72px" alt="VueJobs" />
21-
</picture>
22-
</a>
23-
</p>
24-
2515
<h4 align="center">Silver Sponsors</h4>
2616
<p align="center">
2717
<a href="https://www.vuemastery.com/" target="_blank" rel="noopener noreferrer">
@@ -42,8 +32,8 @@ Vue Router is part of the Vue Ecosystem and is an MIT-licensed open source proje
4232
<p align="center">
4333
<a href="https://stormier.ninja" target="_blank" rel="noopener noreferrer">
4434
<picture>
45-
<source srcset="https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59&v=4" media="(prefers-color-scheme: dark)" height="26px" alt="Stanislas Ormières" />
46-
<img src="https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59&v=4" height="26px" alt="Stanislas Ormières" />
35+
<source srcset="https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59&v=4" media="(prefers-color-scheme: dark)" height="26px" alt="Stanislas Ormières" />
36+
<img src="https://avatars.githubusercontent.com/u/2486424?u=7b0c73ae5d090ce53bf59473094e9606fe082c59&v=4" height="26px" alt="Stanislas Ormières" />
4737
</picture>
4838
</a>
4939
<a href="https://www.vuejs.de" target="_blank" rel="noopener noreferrer">
@@ -58,10 +48,10 @@ Vue Router is part of the Vue Ecosystem and is an MIT-licensed open source proje
5848
<img src="https://posva-sponsors.pages.dev/logos/storyblok.png" height="26px" alt="Storyblok" />
5949
</picture>
6050
</a>
61-
<a href="https://nuxtjs.org" target="_blank" rel="noopener noreferrer">
51+
<a href="https://ui.nuxt.com/pro" target="_blank" rel="noopener noreferrer">
6252
<picture>
63-
<source srcset="https://posva-sponsors.pages.dev/logos/nuxt-dark.svg" media="(prefers-color-scheme: dark)" height="26px" alt="NuxtJS" />
64-
<img src="https://posva-sponsors.pages.dev/logos/nuxt-light.svg" height="26px" alt="NuxtJS" />
53+
<source srcset="https://avatars.githubusercontent.com/u/81570812?v=4" media="(prefers-color-scheme: dark)" height="26px" alt="Nuxt UI Pro Templates" />
54+
<img src="https://avatars.githubusercontent.com/u/81570812?v=4" height="26px" alt="Nuxt UI Pro Templates" />
6555
</picture>
6656
</a>
6757
</p>

SECURITY.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# Reporting a Vulnerability
2+
3+
To report a vulnerability, please email [email protected].
4+
5+
While the discovery of new vulnerabilities is rare, we also recommend always using the latest versions of Vue and its official companion libraries to ensure your application remains as secure as possible.

netlify.toml

+1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
[build.environment]
22
CHROMEDRIVER_SKIP_DOWNLOAD = "true"
3+
NODE_VERSION = "18"
34

45
[build]
56
command = "pnpm run docs:build"

package.json

+18-13
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
22
"name": "@vue/router-root",
33
"private": true,
4-
"packageManager": "pnpm@8.5.0",
4+
"packageManager": "pnpm@8.15.3",
55
"engines": {
6-
"node": ">=18.14.0"
6+
"node": ">=20.9.0"
77
},
88
"workspaces": [
99
"packages/*"
@@ -13,8 +13,13 @@
1313
"size": "node scripts/check-size.mjs",
1414
"build": "pnpm run -r build",
1515
"build:dts": "pnpm run -r build:dts",
16+
"docs": "pnpm run --filter ./packages/docs -r docs",
1617
"docs:api": "pnpm run --filter ./packages/docs -r docs:api",
18+
"docs:translation:compare": "pnpm run --filter ./packages/docs -r docs:translation:compare",
19+
"docs:translation:update": "pnpm run --filter ./packages/docs -r docs:translation:update",
20+
"docs:translation:status": "pnpm run --filter ./packages/docs -r docs:translation:status",
1721
"docs:build": "pnpm run docs:api && pnpm run --filter ./packages/docs -r docs:build",
22+
"docs:preview": "pnpm run --filter ./packages/docs -r docs:preview",
1823
"play": "pnpm run -r play",
1924
"build:size": "pnpm run -r build:size",
2025
"lint": "pnpm run lint:script && pnpm run lint:html",
@@ -25,23 +30,23 @@
2530
},
2631
"devDependencies": {
2732
"brotli": "^1.3.3",
28-
"chalk": "^4.1.2",
29-
"enquirer": "^2.3.6",
30-
"execa": "^6.1.0",
31-
"globby": "^13.1.3",
32-
"lint-staged": "^13.2.2",
33+
"chalk": "^5.3.0",
34+
"enquirer": "^2.4.1",
35+
"execa": "^8.0.1",
36+
"globby": "^14.0.1",
37+
"lint-staged": "^15.2.2",
3338
"minimist": "^1.2.8",
3439
"p-series": "^3.0.0",
3540
"prettier": "^2.8.8",
36-
"semver": "^7.5.1",
37-
"typedoc": "^0.23.26",
38-
"typedoc-plugin-markdown": "^3.14.0",
39-
"typescript": "~4.9.5",
41+
"semver": "^7.6.0",
42+
"typedoc": "^0.25.8",
43+
"typedoc-plugin-markdown": "^3.17.1",
44+
"typescript": "~5.3.3",
4045
"yorkie": "^2.0.0"
4146
},
4247
"gitHooks": {
4348
"pre-commit": "lint-staged",
44-
"commit-msg": "node scripts/verifyCommit.js"
49+
"commit-msg": "node scripts/verifyCommit.mjs"
4550
},
4651
"lint-staged": {
4752
"*.js": [
@@ -61,6 +66,6 @@
6166
}
6267
},
6368
"volta": {
64-
"node": "18.16.0"
69+
"node": "20.11.1"
6570
}
6671
}

packages/docs/.vitepress/config/en.ts

+16-6
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,10 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
4444
text: 'Changelog',
4545
link: 'https://github.com/vuejs/router/blob/main/packages/router/CHANGELOG.md',
4646
},
47+
{
48+
text: 'Vue.js Certification',
49+
link: 'https://certificates.dev/vuejs/?friend=VUEROUTER&utm_source=router_vuejs&utm_medium=link&utm_campaign=router_vuejs_links&utm_content=navbar',
50+
},
4751
],
4852
},
4953
],
@@ -66,7 +70,6 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
6670
},
6771
{
6872
text: 'Essentials',
69-
collapsible: false,
7073
items: [
7174
{
7275
text: 'Getting Started',
@@ -80,6 +83,10 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
8083
text: "Routes' Matching Syntax",
8184
link: '/guide/essentials/route-matching-syntax.html',
8285
},
86+
{
87+
text: 'Named Routes',
88+
link: '/guide/essentials/named-routes.html',
89+
},
8390
{
8491
text: 'Nested Routes',
8592
link: '/guide/essentials/nested-routes.html',
@@ -88,10 +95,6 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
8895
text: 'Programmatic Navigation',
8996
link: '/guide/essentials/navigation.html',
9097
},
91-
{
92-
text: 'Named Routes',
93-
link: '/guide/essentials/named-routes.html',
94-
},
9598
{
9699
text: 'Named Views',
97100
link: '/guide/essentials/named-views.html',
@@ -104,6 +107,10 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
104107
text: 'Passing Props to Route Components',
105108
link: '/guide/essentials/passing-props.html',
106109
},
110+
{
111+
text: 'Active links',
112+
link: '/guide/essentials/active-links.html',
113+
},
107114
{
108115
text: 'Different History modes',
109116
link: '/guide/essentials/history-mode.html',
@@ -112,7 +119,6 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
112119
},
113120
{
114121
text: 'Advanced',
115-
collapsible: false,
116122
items: [
117123
{
118124
text: 'Navigation guards',
@@ -130,6 +136,10 @@ export const enConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
130136
text: 'Composition API',
131137
link: '/guide/advanced/composition-api.html',
132138
},
139+
{
140+
text: 'RouterView slot',
141+
link: '/guide/advanced/router-view-slot.html',
142+
},
133143
{
134144
text: 'Transitions',
135145
link: '/guide/advanced/transitions.html',

0 commit comments

Comments
 (0)