当我运行我的 nuxt 应用程序时，Webpack 客户端抛出错误答案

【问题标题】：Webpack client throwing an error when I run my nuxt app当我运行我的 nuxt 应用程序时，Webpack 客户端抛出错误
【发布时间】：2021-01-04 02:22:41
【问题描述】：

我在尝试运行 nuxt app 时遇到此错误。

(index):1 EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection.

这是我的 nuxt.config.js 代码

    require('dotenv').config()
const development = process.env.NODE_ENV !== 'production'

export default {
  srcDir: 'resources/nuxt',
  mode: 'spa',

  head: {
    titleTemplate: '%s - ' + process.env.APP_NAME,
    title: process.env.APP_NAME || '',
    link: [
      { rel: 'icon', type: 'image/png', href: '/ico2.png' },
      {
        rel: 'stylesheet',
        href: 'https://unicons.iconscout.com/release/v2.1.9/css/unicons.css'
      }
    ],
  laravel: { publicDir: 'public_html' },
  bootstrapVue: { icons: true },
  router: { base: '/' },
  axios: { baseURL: development ? process.env.DEV_URL : undefined },
  build: { extend(config, ctx) {} },
  server: {
    port: 8000
  }
}

我正在尝试从存储中获取一些数据，它正在从 API 断点获取数据，如下所示：

import axios from 'axios'

export const state = () => ({
  apiItems: []
})

export const mutations = {
  SET_API(state, apiItems) {
    state.apiItems = apiItems
  }
}
export const actions = {
  async GET_API({ commit }) {
    const { data } = await axios.get('api/dummy_api')
    commit('SET_API', data)
  }
}

在我的页面文件中：

async fetch({ store, params }) {
    await store.dispatch('adsl/GET_API')
})

谁能帮忙！！

【问题讨论】：

请附上您的nuxt.config.js 和任何其他相关代码，因为如果没有它，几乎不可能帮助解决这个问题！很可能配置的 url-s、开发网络服务器、代理等存在问题。或者，如果您的浏览器中出现此问题，而不是生成错误的代码部分。
好的，我将编辑我的问题以添加一些相关代码..

标签： axios vuex nuxt.js

【解决方案1】：

您需要在客户端和服务器端设置 application/json mime 类型。

这是后端的 PHP 示例：

header('Content-Type: application/json');
echo json_encode($result);

前端的axios示例：

axios.get('my/url', {
    headers: {
        'Content-Type': 'application/json'
    }
})

【讨论】：