Skip to content

Commit 5bae10d

Browse files
committed
build: composables
1 parent d1c19be commit 5bae10d

File tree

11 files changed

+566
-322
lines changed

11 files changed

+566
-322
lines changed

Diff for: build/configs.js

+22-7
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,7 @@ const cjs = require('@rollup/plugin-commonjs')
55
const node = require('@rollup/plugin-node-resolve').nodeResolve
66
const replace = require('rollup-plugin-replace')
77
const version = process.env.VERSION || require('../package.json').version
8-
const banner =
9-
`/*!
8+
const banner = `/*!
109
* vue-router v${version}
1110
* (c) ${new Date().getFullYear()} Evan You
1211
* @license MIT
@@ -31,35 +30,49 @@ module.exports = [
3130
format: 'cjs'
3231
},
3332
{
33+
input: resolve('src/entries/esm.js'),
3434
file: resolve('dist/vue-router.esm.js'),
3535
format: 'es'
3636
},
3737
{
38+
input: resolve('src/entries/esm.js'),
3839
file: resolve('dist/vue-router.esm.browser.js'),
3940
format: 'es',
4041
env: 'development',
4142
transpile: false
4243
},
4344
{
45+
input: resolve('src/entries/esm.js'),
4446
file: resolve('dist/vue-router.esm.browser.min.js'),
4547
format: 'es',
4648
env: 'production',
4749
transpile: false
50+
},
51+
{
52+
input: resolve('src/composables/index.js'),
53+
file: resolve('./dist/composables.mjs'),
54+
format: 'es'
55+
},
56+
{
57+
input: resolve('src/composables/index.js'),
58+
file: resolve('./dist/composables.js'),
59+
format: 'cjs'
4860
}
4961
].map(genConfig)
5062

5163
function genConfig (opts) {
5264
const config = {
5365
input: {
54-
input: resolve('src/index.js'),
66+
input: opts.input || resolve('src/index.js'),
5567
plugins: [
5668
flow(),
5769
node(),
5870
cjs(),
5971
replace({
6072
__VERSION__: version
6173
})
62-
]
74+
],
75+
external: ['vue']
6376
},
6477
output: {
6578
file: opts.file,
@@ -70,9 +83,11 @@ function genConfig (opts) {
7083
}
7184

7285
if (opts.env) {
73-
config.input.plugins.unshift(replace({
74-
'process.env.NODE_ENV': JSON.stringify(opts.env)
75-
}))
86+
config.input.plugins.unshift(
87+
replace({
88+
'process.env.NODE_ENV': JSON.stringify(opts.env)
89+
})
90+
)
7691
}
7792

7893
if (opts.transpile !== false) {

Diff for: dist/composables.js

+87
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
/*!
2+
* vue-router v3.5.4
3+
* (c) 2022 Evan You
4+
* @license MIT
5+
*/
6+
'use strict';
7+
8+
Object.defineProperty(exports, '__esModule', { value: true });
9+
10+
var vue = require('vue');
11+
12+
function useRouter () {
13+
var i = vue.getCurrentInstance();
14+
if (process.env.NODE_ENV !== 'production' && !i) {
15+
throwNoCurrentInstance('useRouter');
16+
}
17+
18+
return i.proxy.$root.$router
19+
}
20+
21+
function useRoute () {
22+
var i = vue.getCurrentInstance();
23+
if (process.env.NODE_ENV !== 'production' && !i) {
24+
throwNoCurrentInstance('useRoute');
25+
}
26+
27+
var root = i.proxy.$root;
28+
if (!root._$route) {
29+
var route = vue.effectScope(true).run(
30+
function () { return vue.shallowReactive(Object.assign({}, root.$router.currentRoute)); }
31+
);
32+
root._$route = route;
33+
34+
root.$router.afterEach(function (to) {
35+
Object.assign(route, to);
36+
});
37+
}
38+
39+
return root._$route
40+
}
41+
42+
// TODO:
43+
// export function useLink () {}
44+
45+
function onBeforeRouteUpdate (guard) {
46+
var i = vue.getCurrentInstance();
47+
if (process.env.NODE_ENV !== 'production' && !i) {
48+
throwNoCurrentInstance('onBeforeRouteUpdate');
49+
}
50+
51+
var router = useRouter();
52+
53+
var target = i.proxy;
54+
// find the nearest routerview to know the depth
55+
while (target && target.$vnode && target.$vnode.data && target.$vnode.data.routerViewDepth == null) {
56+
target = target.$parent;
57+
}
58+
59+
var depth = target && target.$vnode && target.$vnode.data ? target.$vnode.data.routerViewDepth : null;
60+
61+
console.log('found depth', depth);
62+
63+
// TODO: allow multiple guards?
64+
i.proxy.$options.beforeRouteUpdate = guard;
65+
66+
var removeGuard = router.beforeEach(function (to, from, next) {
67+
// TODO: check it's an update
68+
return guard(to, from, next)
69+
});
70+
71+
vue.onUnmounted(removeGuard);
72+
73+
return removeGuard
74+
}
75+
76+
// TODO:
77+
// export function onBeforeRouteLeave () {}
78+
79+
function throwNoCurrentInstance (method) {
80+
throw new Error(
81+
("[vue-router]: Missing current instance. " + method + "() must be called inside <script setup> or setup().")
82+
)
83+
}
84+
85+
exports.onBeforeRouteUpdate = onBeforeRouteUpdate;
86+
exports.useRoute = useRoute;
87+
exports.useRouter = useRouter;

Diff for: dist/composables.mjs

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
/*!
2+
* vue-router v3.5.4
3+
* (c) 2022 Evan You
4+
* @license MIT
5+
*/
6+
import { getCurrentInstance, effectScope, shallowReactive, onUnmounted } from 'vue';
7+
8+
function useRouter () {
9+
var i = getCurrentInstance();
10+
if (process.env.NODE_ENV !== 'production' && !i) {
11+
throwNoCurrentInstance('useRouter');
12+
}
13+
14+
return i.proxy.$root.$router
15+
}
16+
17+
function useRoute () {
18+
var i = getCurrentInstance();
19+
if (process.env.NODE_ENV !== 'production' && !i) {
20+
throwNoCurrentInstance('useRoute');
21+
}
22+
23+
var root = i.proxy.$root;
24+
if (!root._$route) {
25+
var route = effectScope(true).run(
26+
function () { return shallowReactive(Object.assign({}, root.$router.currentRoute)); }
27+
);
28+
root._$route = route;
29+
30+
root.$router.afterEach(function (to) {
31+
Object.assign(route, to);
32+
});
33+
}
34+
35+
return root._$route
36+
}
37+
38+
// TODO:
39+
// export function useLink () {}
40+
41+
function onBeforeRouteUpdate (guard) {
42+
var i = getCurrentInstance();
43+
if (process.env.NODE_ENV !== 'production' && !i) {
44+
throwNoCurrentInstance('onBeforeRouteUpdate');
45+
}
46+
47+
var router = useRouter();
48+
49+
var target = i.proxy;
50+
// find the nearest routerview to know the depth
51+
while (target && target.$vnode && target.$vnode.data && target.$vnode.data.routerViewDepth == null) {
52+
target = target.$parent;
53+
}
54+
55+
var depth = target && target.$vnode && target.$vnode.data ? target.$vnode.data.routerViewDepth : null;
56+
57+
console.log('found depth', depth);
58+
59+
// TODO: allow multiple guards?
60+
i.proxy.$options.beforeRouteUpdate = guard;
61+
62+
var removeGuard = router.beforeEach(function (to, from, next) {
63+
// TODO: check it's an update
64+
return guard(to, from, next)
65+
});
66+
67+
onUnmounted(removeGuard);
68+
69+
return removeGuard
70+
}
71+
72+
// TODO:
73+
// export function onBeforeRouteLeave () {}
74+
75+
function throwNoCurrentInstance (method) {
76+
throw new Error(
77+
("[vue-router]: Missing current instance. " + method + "() must be called inside <script setup> or setup().")
78+
)
79+
}
80+
81+
export { onBeforeRouteUpdate, useRoute, useRouter };

Diff for: examples/webpack.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ module.exports = {
5050
alias: {
5151
vue: 'vue/dist/vue.esm.js',
5252
'vue-router': path.join(__dirname, '..', 'src'),
53-
'vue-router/composables': path.join(__dirname, '..', 'src/composables.js')
53+
'vue-router/composables': path.join(__dirname, '..', 'src/composables')
5454
}
5555
},
5656

Diff for: package.json

+17
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,23 @@
2121
"vetur/tags.json",
2222
"vetur/attributes.json"
2323
],
24+
"exports": {
25+
".": {
26+
"import": {
27+
"node": "./dist/vue-router.mjs",
28+
"default": "./dist/vue-router.esm.js"
29+
},
30+
"require": "./dist/vue-router.common.js",
31+
"types": "./types/index.d.ts"
32+
},
33+
"./composables": {
34+
"import": "./dist/composables.mjs",
35+
"require": "./dist/composables.js"
36+
},
37+
"./dist/*": "./dist/*",
38+
"./types/*": "./types/*",
39+
"./package.json": "./package.json"
40+
},
2441
"vetur": {
2542
"tags": "vetur/tags.json",
2643
"attributes": "vetur/attributes.json"

Diff for: src/composables.js renamed to src/composables/index.js

+31-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { getCurrentInstance, shallowReactive, effectScope } from 'vue'
1+
import { getCurrentInstance, shallowReactive, effectScope, onUnmounted } from 'vue'
22

33
export function useRouter () {
44
const i = getCurrentInstance()
@@ -33,8 +33,36 @@ export function useRoute () {
3333
// TODO:
3434
// export function useLink () {}
3535

36-
// TODO:
37-
// export function onBeforeRouteUpdate () {}
36+
export function onBeforeRouteUpdate (guard) {
37+
const i = getCurrentInstance()
38+
if (process.env.NODE_ENV !== 'production' && !i) {
39+
throwNoCurrentInstance('onBeforeRouteUpdate')
40+
}
41+
42+
const router = useRouter()
43+
44+
let target = i.proxy
45+
// find the nearest routerview to know the depth
46+
while (target && target.$vnode && target.$vnode.data && target.$vnode.data.routerViewDepth == null) {
47+
target = target.$parent
48+
}
49+
50+
const depth = target && target.$vnode && target.$vnode.data ? target.$vnode.data.routerViewDepth : null
51+
52+
console.log('found depth', depth)
53+
54+
// TODO: allow multiple guards?
55+
i.proxy.$options.beforeRouteUpdate = guard
56+
57+
const removeGuard = router.beforeEach((to, from, next) => {
58+
// TODO: check it's an update
59+
return guard(to, from, next)
60+
})
61+
62+
onUnmounted(removeGuard)
63+
64+
return removeGuard
65+
}
3866

3967
// TODO:
4068
// export function onBeforeRouteLeave () {}

Diff for: src/entries/cjs.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import VueRouter from '../router'
2+
3+
export default VueRouter

Diff for: src/entries/esm.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import VueRouter from '../router'
2+
3+
export const version = '__VERSION__'
4+
export { isNavigationFailure, NavigationFailureType } from '../util/errors'
5+
export { START as START_LOCATION } from '../util/route'
6+
7+
// we can't add the other composables here because people could still be using an older version of vue and that would
8+
// create a compilation error trying to import from vue
9+
10+
export default VueRouter

0 commit comments

Comments
 (0)