feat: standalone nprogress plugin

- Install it: yarn add @vuepress/plugin-nprogress@next

packages/@vuepress/plugin-nprogress/.npmignore

@@ -0,0 +1,2 @@
+__tests__
+__mocks__

packages/@vuepress/plugin-nprogress/README.md

@@ -0,0 +1,3 @@
+# @vuepress/plugin-nprogress
+
+> nprogress plugin for vuepress

packages/@vuepress/plugin-nprogress/clientRootMixin.js

@@ -0,0 +1,21 @@
+import Vue from 'vue'
+import nprogress from 'nprogress'
+
+export default {
+  mounted () {
+    // configure progress bar
+    nprogress.configure({ showSpinner: false })
+
+    this.$router.beforeEach((to, from, next) => {
+      if (to.path !== from.path && !Vue.component(to.name)) {
+        nprogress.start()
+      }
+      next()
+    })
+
+    this.$router.afterEach(() => {
+      nprogress.done()
+      this.isSidebarOpen = false
+    })
+  }
+}

packages/@vuepress/plugin-nprogress/enhanceAppFile.js

@@ -0,0 +1 @@
+import './nprogress.styl'

packages/@vuepress/plugin-nprogress/index.js

@@ -0,0 +1,6 @@
+const { resolve } = require('path')
+
+module.exports = {
+  clientRootMixin: resolve(__dirname, 'clientRootMixin.js'),
+  enhanceAppFiles: resolve(__dirname, 'enhanceAppFile.js')
+}

packages/@vuepress/plugin-nprogress/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "@vuepress/plugin-nprogress",
+  "version": "1.0.0-alpha.30",
+  "description": "nprogress plugin for vuepress",
+  "main": "index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vuejs/vuepress.git"
+  },
+  "keywords": [
+    "documentation",
+    "vue",
+    "vuepress",
+    "generator"
+  ],
+  "dependencies": {
+    "nprogress": "^0.2.0"
+  },
+  "author": "ULIVZ <[email protected]>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/vuejs/vuepress/issues"
+  },
+  "homepage": "https://github.com/vuejs/vuepress/packages/@vuepress/plugin-nprogress#readme"
+}

packages/@vuepress/theme-default/index.js

@@ -19,6 +19,7 @@ module.exports = (options, ctx) => ({
 
   plugins: [
     '@vuepress/active-header-links',
-    '@vuepress/search'
+    '@vuepress/search',
+    '@vuepress/plugin-nprogress'
   ]
 })

packages/@vuepress/theme-default/layouts/Layout.vue

@@ -48,8 +48,6 @@
 </template>
 
 <script>
-import Vue from 'vue'
-import nprogress from 'nprogress'
 import Home from '../components/Home.vue'
 import Navbar from '../components/Navbar.vue'
 import Page from '../components/Page.vue'
@@ -115,18 +113,7 @@ export default {
   },
 
   mounted () {
-    // configure progress bar
-    nprogress.configure({ showSpinner: false })
-
-    this.$router.beforeEach((to, from, next) => {
-      if (to.path !== from.path && !Vue.component(to.name)) {
-        nprogress.start()
-      }
-      next()
-    })
-
     this.$router.afterEach(() => {
-      nprogress.done()
       this.isSidebarOpen = false
     })
   },

packages/@vuepress/theme-default/package.json

@@ -31,8 +31,8 @@
   "dependencies": {
     "@vuepress/plugin-active-header-links": "^1.0.0-alpha.30",
     "@vuepress/plugin-search": "^1.0.0-alpha.30",
+    "@vuepress/plugin-nprogress": "^1.0.0-alpha.30",
     "docsearch.js": "^2.5.2",
-    "nprogress": "^0.2.0",
     "stylus": "^0.54.5",
     "stylus-loader": "^3.0.2"
   }

packages/@vuepress/theme-default/styles/theme.styl

@@ -1,4 +1,3 @@
-@require './nprogress'
 @require './code'
 @require './custom-blocks'
 @require './arrow'