feat: upgrade for nuxt rc8

BREAKING CHANGE: app.axios is not available anymore (without $) should always use app.$axios

Author: Pooya Parsa

README.md

@@ -8,7 +8,7 @@
 
 [![js-standard-style](https://cdn.rawgit.com/standard/standard/master/badge.svg)](http://standardjs.com)
 
-> 🔒 Secure and easy [axios](https://github.com/mzabriskie/axios) integration with Nuxt.js.
+> Secure and Easy [Axios](https://github.com/mzabriskie/axios) integration with Nuxt.js.
    
 [📖 **Release Notes**](./CHANGELOG.md)
 
@@ -49,37 +49,28 @@
 
 ```js
 async asyncData({ app }) {
-  const ip = await app.axios.$get('http://icanhazip.com')
+  const ip = await app.$axios.$get('http://icanhazip.com')
   return { ip }
 }
 ```
 
 ### Store `nuxtServerInit`
 ```js
 async nuxtServerInit ({ commit }, { app }) {
-  const ip = await app.axios.$get('http://icanhazip.com')
+  const ip = await app.$axios.$get('http://icanhazip.com')
   commit('SET_IP', ip)
 }
 ```
 
 ### Store actions
-If you need axios instance in store actions, you may have to pass it when dispatching.
+(Needs Nuxt >= 1.0.0-RC8)
 
 ```js
-// In components
-export default {
-  methods: {
-    updateIP() {
-      this.$store.dispatch('getIP', { axios: this.$axios })
-    }
-  }
-}
-
 // In store
 {
   actions: {
-    async getIP ({ commit }, { axios }) {
-      const ip = await axios.$get('http://icanhazip.com')
+    async getIP ({ commit }) {
+      const ip = await this.$axios.$get('http://icanhazip.com')
       commit('SET_IP', ip)
     }
   }
@@ -159,10 +150,10 @@ requestInterceptor: (config, { store }) => {
 Axios plugin also supports fetch style requests with `$` prefixed methods:
 ```js
 // Normal usage with axios
-let data = (await axios.get('...')).data
+let data = (await $axios.get('...')).data
 
 // Fetch Style
-let data = await axios.$get('...')
+let data = await $axios.$get('...')
 ```
 
 ### `setHeader(name, value, scopes='common')`
@@ -245,9 +236,9 @@ Start Nuxt
 
 Now you can make requests to backend: (Works fine in both SSR and Browser)
 ```js
-async asyncData({app}) {
+async asyncData({ app }) {
   // Magically makes request to http://www.mocky.io/v2/59388bb4120000dc00a672e2
-  const nuxt = await app.axios.$get('59388bb4120000dc00a672e2')
+  const nuxt = await app.$axios.$get('59388bb4120000dc00a672e2')
 
   return {
     nuxt // -> { nuxt: 'Works!' }

lib/index.js

@@ -43,7 +43,7 @@ module.exports = function nuxtAxios (moduleOptions) {
   }
 
   // Register plugin
-  addPlugin.call(this, {
+  this.addPlugin({
     src: path.resolve(__dirname, 'plugin.template.js'),
     fileName: 'axios.js',
     options
@@ -53,14 +53,4 @@ module.exports = function nuxtAxios (moduleOptions) {
   console.log(`[AXIOS] Base URL: ${chalk.green(options.baseURL)} , Browser: ${chalk.green(options.browserBaseURL)}`)
 }
 
-// Temporary fix for nuxt/nuxt.js#1127
-function addPlugin (template) {
-  const { dst } = this.addTemplate(template)
-  // Add to nuxt plugins
-  this.options.plugins.unshift({
-    src: path.join(this.options.buildDir, dst),
-    ssr: template.ssr
-  })
-}
-
 module.exports.meta = require('../package.json')

lib/plugin.template.js

@@ -1,25 +1,6 @@
 import Axios from 'axios'
 import Vue from 'vue'
 
-const axiosPlugin = {
-  install() {
-    if(Vue.__nuxt_axios_installed__) {
-      return
-    }
-    Vue.__nuxt_axios_installed__ = true
-
-    if (!Vue.prototype.hasOwnProperty('$axios')) {
-      Object.defineProperty(Vue.prototype, '$axios', {
-        get () {
-          return this.$root.$options.$axios
-        }
-      })
-    }
-  }
-}
-
-Vue.use(axiosPlugin)
-
 // We cannot extend Axios.prototype
 const axiosExtraProto = {}
 
@@ -111,7 +92,7 @@ const baseURL = process.browser
   ? (process.env.API_URL_BROWSER || '<%= options.browserBaseURL %>')
   : (process.env.API_URL || '<%= options.baseURL %>')
 
-export default (ctx) => {
+export default (ctx, inject) => {
   const { app, store, req } = ctx
 
   // Create a fresh objects for all default header scopes
@@ -182,12 +163,8 @@ export default (ctx) => {
   // Error handler
   axios.interceptors.response.use(undefined, errorHandler.bind(ctx));
 
-  // Make accessible using context
-  app.axios = app.$axios = axios
-  ctx.axios = ctx.$axios = axios
-  if (store) {
-    store.axios = store.$axios = axios
-  }
+  // Publish axios to the context
+  inject('axios', axios)
 
   // Setup axios helpers
   setupHelpers(axios)

package.json

@@ -30,12 +30,12 @@
   "dependencies": {
     "axios": "^0.16.2",
     "chalk": "^2.1.0",
-    "nuxt": "^1.0.0-rc4",
+    "nuxt": "^1.0.0-rc8",
     "whatwg-url": "^6.1.0"
   },
   "devDependencies": {
     "codecov": "^2.3.0",
-    "eslint": "^4.4.1",
+    "eslint": "^4.5.0",
     "eslint-config-standard": "^10.2.1",
     "eslint-plugin-import": "^2.7.0",
     "eslint-plugin-jest": "^20.0.3",

test/fixture/pages/asyncData.vue

@@ -7,7 +7,7 @@
 <script>
 export default {
   async asyncData ({ app }) {
-    let res = await app.axios.$get('foo/bar')
+    let res = await app.$axios.$get('foo/bar')
     return {
       res
     }

test/fixture/pages/ssr.vue

@@ -10,7 +10,7 @@ export default {
   async fetch ({ app, route }) {
     let doLogin = route.query.login !== undefined
     if (doLogin) {
-      app.axios.setHeader('sessionId', reqCtr++)
+      app.$axios.setHeader('sessionId', reqCtr++)
     }
   },
   computed: {