vue.js - Vercel 和 Nuxt 部署时出现 FUNCTION_INVOCATION_FAILED 错误

标签 vue.js nuxt.js vercel

使用 vercel.json 配置从 GitHub 导入一个 Nuxt 项目:

{
    "version": 2,
    "builds": [
      {
        "src": "nuxt.config.js",
        "use": "@nuxtjs/vercel-builder"
      }
    ]
}

我的package.json:

{
  "name": "test-app-v2",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "lint:js": "eslint --ext \".js,.vue\" --ignore-path .gitignore .",
    "lint": "yarn lint:js"
  },
  "lint-staged": {
    "*.{js,vue}": "eslint"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "dependencies": {
    "@nuxtjs/composition-api": "^0.24.0",
    "@nuxtjs/pwa": "^3.3.5",
    "core-js": "^3.9.1",
    "nuxt": "^2.15.3"
  },
  "devDependencies": {
    "@nuxt/types": "^2.15.3",
    "@nuxt/typescript-build": "^2.1.0",
    "@nuxtjs/eslint-config-typescript": "^6.0.0",
    "@nuxtjs/eslint-module": "^3.0.2",
    "@nuxtjs/vuetify": "^1.11.3",
    "babel-eslint": "^10.1.0",
    "eslint": "^7.22.0",
    "eslint-config-prettier": "^8.1.0",
    "eslint-plugin-nuxt": "^2.0.0",
    "eslint-plugin-prettier": "^3.3.1",
    "eslint-plugin-vue": "^7.7.0",
    "husky": "^4.3.8",
    "lint-staged": "^10.5.4",
    "prettier": "^2.2.1"
  }
}

nuxt.config.js

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

export default {
  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    titleTemplate: '%s - test-app-v2',
    title: 'test-app-v2',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' },
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
  },

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [],

  // 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',
    '@nuxtjs/composition-api/module',
  ],

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

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

  // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify
  vuetify: {
    customVariables: ['~/assets/variables.scss'],
    theme: {
      dark: false,
      themes: {
        dark: {
          primary: colors.blue.darken2,
          accent: colors.grey.darken3,
          secondary: colors.amber.darken3,
          info: colors.teal.lighten1,
          warning: colors.amber.base,
          error: colors.deepOrange.accent4,
          success: colors.green.accent3,
        },
      },
    },
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {},
}

我还没有 API,这是功能选项卡中的错误日志:

enter image description here

最佳答案

OP 不是打算使用 SSR 部署它吗?使用构建命令 yarn generate 只会生成一个静态站点。

关于vue.js - Vercel 和 Nuxt 部署时出现 FUNCTION_INVOCATION_FAILED 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67741207/

相关文章:

javascript - VueJS 组件数据不更新

javascript - 如何销毁 <keep-alive> 缓存的 VueJS 组件

javascript - 动态 Nuxt 页面选择

javascript - 如何将动态 Prop 绑定(bind)到 VueJS 2 中的动态组件

python - 如何在 FastAPI 的 CORS 中间件中正确使用正则表达式?

javascript - 在输入字段上使用 vue 指令(v-model、@input)时,vue 中的数据列表出现意​​外行为?

django - 让 Django、VUE、CORS 和 CSRF 与真实世界的例子一起工作

javascript - 在 nuxt.js 上为 vuetify app v2.0 添加暗模式切换

node.js - 如何在NextJS Vercel项目中进行301重定向?

next.js - Nextjs 情感js 和 vercel : Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: . .@emotion/cache/node_modules/stylis/dist/stylis.umd.js