首页 > 解决方案 > nuxt:在 index.vue 的生产模式下,Django API 中的数据未更新

问题描述

我将 nuxt 与 Django API 一起使用。在我的 index.vue 中,我发出服务器请求以获取数据。它在开发模式下工作,但在生产模式下不工作。在生产中,当我更改对象的值时,不会显示更改,我必须执行“npm run generate”才能显示更改。在另一条路上,它可以工作,但不能在第一页上......

任何想法?谢谢

nuxt 配置

let development = process.env.NODE_ENV !== 'production'
let domain = 'my domain'

export default {
  mode: 'universal',
  env: {
    baseUrl: development ? 'http://localhost:8000' : domain
  },
  /*
  ** Headers of the page
  */

  head: {
    title: process.env.npm_package_name || '',
    htmlAttrs: {
        lang: 'fr',
      },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  /*
  ** Customize the progress-bar color
  */
  loading: { color: '#fff' },
  /*
  ** Global CSS
  */
  css: [
    '~/assets/scss/index.scss',
  ],
  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
    '~/plugins/filters.js',
    '~/plugins/axios.js',
  ],
  /*
  ** Nuxt.js dev-modules
  */
  buildModules: [
],
moment: {
    defaultLocale: 'fr',
    locales: ['fr']
},
/*
** Nuxt.js modules
*/
modules: [
    // Doc: https://bootstrap-vue.js.org
    '@nuxtjs/moment',
    'bootstrap-vue/nuxt',
    '@nuxtjs/axios',
    '@nuxtjs/style-resources',
  ],
  //Resource shared
  styleResources: {
    scss: [
      'bootstrap/scss/_functions.scss',
      'bootstrap/scss/_variables.scss',
      'bootstrap/scss/mixins/_breakpoints.scss',
      './assets/scss/variable/*.scss',
      
  ],
   },
  // deactivate bootstrap-vue for user custom bootstrap
  bootstrapVue: {
    bootstrapCSS: false, 
    bootstrapVueCSS: false
  },
  //proxy backend url enabled
  axios: {
    baseURL:  development ? 'http://localhost:8000' : domain,
    proxy:true,
    credentials: true,
  },
  proxy: {
    '/api/': development ? 'http://localhost:8000' : domain,
    '/media/': development ? 'http://localhost:8000' : domain,
    '/auth/': development ? 'http://localhost:8000' : domain
  },
  module: {
    rules: [
        {
           test: /\.s[ac]ss$/i,
           use: ['style-loader','css-loader','sass-loader',],
         },  
    ],
},
  /*
  ** Build configuration
  */
 build: {
    analyse: true,
    extend (config, {isClient, loaders}) {
        loaders.imgUrl.limit = 10000
    }
 }
}

标签: nuxt.jsproduction

解决方案


推荐阅读