node.js - 从 Express 服务器以编程方式构建 Nuxt.js 时出错

Question

我正在尝试从 Express 服务器以编程方式运行 Nuxt，但是在构建应用程序并打开浏览器控制台后出现一些错误:





我的 nuxt.config.ts 看起来像:

import NuxtConfiguration from '@nuxt/config';

/**
 * Nuxt.js admin console app config.
 */
export const config: NuxtConfiguration =  {
  /**
   * Directory paths options. Remove `rootDir` and `modulesDir` properties if you want to run/build admin console Nuxt app.
   */
  rootDir: 'src/admin-console',
  modulesDir: ['../../node_modules'],
  mode: 'universal',
  /*
  ** Headers of the page.
  */
  head: {
    title: process.env.npm_package_name || '',
    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: [
  ],
  /*
  ** Plugins to load before mounting the App.
  */
  plugins: [
  ],
  /*
  ** Nuxt.js modules.
  */
  modules: [
    // Doc: https://bootstrap-vue.js.org/docs/
    'bootstrap-vue/nuxt',
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
  ],
  /*
  ** Axios module configuration.
  ** See https://axios.nuxtjs.org/options
  */
  axios: {
  },
};

export default config;

我开始将 Nuxt 构建为 Express 中间件:

import { Application } from 'express';
import { Nuxt, Builder } from 'nuxt';
import config from '../admin-console/nuxt.config';

/**
 * Builds admin console Nuxt app.
 * @param app Express application instance.
 */
export async function buildAdminConsoleNuxtApp(app: Application) {
  const nuxt = new Nuxt(config);
  try {
    await new Builder(nuxt).build();
  } catch (error) {
    throw new Error(error);
  }

  app.use('/admin', nuxt.render);
}

并像这样注册:

await buildAdminConsoleNuxtApp(this.app);

在我发现的所有示例中，这是构建 Nuxt 的唯一方法，所以我不知道我做错了什么。构建的应用程序不会检测点击事件等，并且无法正常运行。

Answer 1

问题不是设置 config.dev属性，应该像 documentation 中所说的那样使用以编程方式运行 Nuxt 时。
我的工作代码如下所示:

import { Application } from 'express';
import { Nuxt, Builder, Generator } from 'nuxt';
import config from '../admin-console/nuxt.config';
import { EnvType } from '../config/types';

/**
 * Builds admin console Nuxt.js/Vue.js application.
 * @param app Express application instance.
 */ 
export async function buildAdminConsoleNuxtApp(app: Application) {
  config.dev = process.env.NODE_ENV === EnvType.PRODUCTION;
  const nuxt = new Nuxt(config);
  try {
    const builder = await new Builder(nuxt);
    await new Generator(nuxt, builder).generate({ build: true, init: true });
  } catch (error) {
    throw new Error(error);
  }

  app.use('/', nuxt.render);
}