diff --git a/packages/@vuepress/core/lib/app/app.js b/packages/@vuepress/core/lib/app/app.js index 7e592d16..a56f88f5 100644 --- a/packages/@vuepress/core/lib/app/app.js +++ b/packages/@vuepress/core/lib/app/app.js @@ -62,21 +62,7 @@ export function createApp (isServer) { base: siteData.base, mode: 'history', fallback: false, - routes, - scrollBehavior: (to, from, saved) => { - if (saved) { - return saved - } else if (to.hash) { - if (Vue.$vuepress.$get('disableScrollBehavior')) { - return false - } - return { - selector: to.hash - } - } else { - return { x: 0, y: 0 } - } - } + routes }) // redirect /foo to /foo/ diff --git a/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js b/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js index 899fe744..0a6f62ff 100644 --- a/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js +++ b/packages/@vuepress/core/lib/app/root-mixins/updateLoadingState.js @@ -1,18 +1,13 @@ +import SmoothScroll from 'smooth-scroll/dist/smooth-scroll.js' + export default { created () { this.$vuepress.$on('AsyncMarkdownContentMounted', () => { - this.$vuepress.$set('contentMounted', true); + this.$vuepress.$set('contentMounted', true) - [].slice.call(document.querySelectorAll('a[href^="#"]')).forEach(anchor => { - anchor.addEventListener('click', function (e) { - e.preventDefault() - history.pushState(history.state, document.title, e.target.href) - window.scroll({ - top: e.target.offsetTop - 75, - left: 0, - behavior: 'smooth' - }) - }) + this.$smoothScroll = new SmoothScroll('a[href*="#"]', { + speed: 1000, + easing: 'easeInOutCubic' }) if (this.$route.hash) { @@ -37,6 +32,11 @@ export default { watch: { '$route.path' () { this.$vuepress.$set('contentMounted', false) + this.$smoothScroll.destroy() } + }, + + beforeDestroy () { + this.$smoothScroll.destroy() } } diff --git a/packages/@vuepress/core/package.json b/packages/@vuepress/core/package.json index ab226999..09bf5c68 100644 --- a/packages/@vuepress/core/package.json +++ b/packages/@vuepress/core/package.json @@ -68,7 +68,8 @@ "webpack-chain": "^4.6.0", "webpack-merge": "^4.1.2", "webpack-serve": "^1.0.2", - "webpackbar": "^2.6.1" + "webpackbar": "^2.6.1", + "smooth-scroll": "^15.0.0" }, "engines": { "node": ">=8" diff --git a/yarn.lock b/yarn.lock index 296577b4..a15d40a0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8119,6 +8119,10 @@ slice-ansi@1.0.0: dependencies: is-fullwidth-code-point "^2.0.0" +smooth-scroll@^15.0.0: + version "15.0.0" + resolved "https://registry.yarnpkg.com/smooth-scroll/-/smooth-scroll-15.0.0.tgz#be4f9cb2cc4952d80db6736e5656ed5849305272" + snapdragon-node@^2.0.1: version "2.1.1" resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"