contentacms / contenta_vue_nuxt

Start in minutes a Drupal 8 with JSON API and Vue.js : a Nuxt.js ( Vue.js SSR ) consumer for Contenta CMS
https://contentanuxt.now.sh
GNU General Public License v2.0
126 stars 32 forks source link

Nuxt app crashes when files are edited during `npm run dev` #51

Open marcvangend opened 5 years ago

marcvangend commented 5 years ago

While npm run dev was running, I tried to change a component file. Even the most trivial change, such as indenting a line of code, resulted in a crash. The error message on the command line:

✖ error TypeError: Cannot read property 'data' of undefined
  at exports.modules../lib/jsonApiClient.js.axios__WEBPACK_IMPORTED_MODULE_1___default.a.interceptors.response.use.response (pages/recipes/index.js:900:83)
  at process._tickCallback (internal/process/next_tick.js:68:7)

I have been looking into this with support from @yann-yinn (thank you!) and finally found this workaround:

import qs from 'qs';

 // Add a response interceptor to format response with jsonapi-parse
 axios.interceptors.response.use(response => {
-  return jsonapiParse.parse(response.data).data;
+  const parsedResponse = jsonapiParse.parse(response.data);
+  if (parsedResponse === undefined) {
+    return response;
+  }
+  return parsedResponse.data;
 });

 export default {

What I think is happening: The response object that is passed to this interceptor when the first request is made, is indeed a proper response object that contains response.data and can be parsed by jsonapiParse.parse(). However, when a file is edited and the app is rebuilt, it seems that the parsed result (which was cached somewhere?) passes through this interceptor again.

While this workaround stops the crashing, it's ugly and it shouldn't be there. I guess we should be looking for a way to either pass the original, raw response to the interceptor again, or else avoid calling the interceptor again when the app is rebuilt with cached data. I'm willing to help fix this, but I could use some help in understanding how the app works and finding out where this data comes from.

Additional info about my setup: contenta_vue_nuxt 2.0.1, with under the hood nuxt 2.2.0 and axios 0.18.0 node v10.14.2 with npm v6.4.1 backend: contenta_jsonapi dev-8.x-3.x, installed using contenta-jsonapi-project dev-8.x-2.x

ludo1960 commented 5 years ago

Hello, You seem to be a bit further down the road on this project than me. I'm hoping you can throw a few clues my way. What did you put in your serverFilesUrl configuration? I put http:mysite.com/api/files and get the error:TypeError Cannot read property 'data' of undefined. I too would like to find out what makes this app tick. Perhaps we can pool resources?

yann-yinn commented 5 years ago

Yep sorry guys i moved on other things, as i wrote in the README and i can't help you. Should we archive this project to avoid frustration ? cc @e0ipso

e0ipso commented 5 years ago

I think it's fine to leave it there for inspiration @yann-yinn.