target: 'static' 不在 nuxt 中预渲染

Question

我有一个 Nuxt 应用程序，我从商店内的 nuxtServerInit() 中的 API 获取内容。

但是，如果我在 nuxt.config.js 中生成静态版本设置 target: "static"，内容也没有在页面中预呈现，而我将其设置为 "universal"，然后它们是。

如果您想完全静态，'static' 不是正确的设置吗？

这是我的 nuxt.config.js 文件

// import colors from 'vuetify/es5/util/colors'

export default {
  // Global page headers: https://go.nuxtjs.dev/config-head
  // target: process.env.NODE_TARGET === 'static' ? 'static' : 'server',
  // ssr: true,
  target: 'universal',
  router: {
    base: '/wip/roboat-website/roboat-frontend/dist',
    routeNameSplitter: '/'
  },
  server: {
    host: "localhost" // default: localhost
  },
  head: {
    titleTemplate: '%s - roboat-frontend',
    title: 'roboat-frontend',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' },
      { name: 'format-detection', content: 'telephone=no' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [
    '~/assets/css/custom.css'
  ],
  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
    // https://go.nuxtjs.dev/typescript
    '@nuxt/typescript-build',
    // https://go.nuxtjs.dev/vuetify
    ['@nuxtjs/vuetify', { treeShake: true }]
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
    // https://go.nuxtjs.dev/pwa
    '@nuxtjs/pwa',
  ],

  // Axios module configuration: https://go.nuxtjs.dev/config-axios
  axios: {},
  env: {
    NUXT_ENV_API_HOST: process.env.NUXT_ENV_API_HOST,

  },
  // PWA module configuration: https://go.nuxtjs.dev/pwa
  pwa: {
    manifest: {
      lang: 'en'
    }
  },

  // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify
  vuetify: {
    optionsPath: './vuetify.options.js',
    customVariables: ['~/assets/variables.scss'],
    treeShake: true,
    // defaultAssets: false,
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    html: {
      minify: {
        collapseBooleanAttributes: true,
        decodeEntities: true,
        minifyCSS: true,
        minifyJS: true,
        processConditionalComments: true,
        removeEmptyAttributes: true,
        removeRedundantAttributes: true,
        trimCustomFragments: true,
        useShortDoctype: true,
        minifyURLs: true,
        removeComments: true,
        removeEmptyElements: true
      }
    },
    // analyze: true,
    optimizeCSS:true,
    extractCSS: true,
    babel: {
      plugins: [
        ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
      ]
    },
    extend(config, { isDev, isClient }) {
      // ..
      // if (isClient) {
      config.module.rules.push({
        test: /\.(obj|mtl|fbx|gltf|glb|hdr|bin)$/,
        loader: 'file-loader'
      })
    },
    transpile: [
      "three"
    ]
  },
}

Answer 1

看起来最后，OP 确实有一个带有 target: 'static' 和 ssr: true 的工作代码。
这似乎是合法的，因为这是推荐的（也是最新的）做事方式：

target: 'static' 不在 nuxt 中预渲染

target: 'static' does not pre-render in nuxt

server-side-rendering

strapi

vuex

nuxt.js