想在 Nuxt.js + Google App Engine 上显示一个网站图标

Question

前提/我想要实现的目标

我正在 Google App Engine 上以 SSR 模式部署 Nuxt.js 应用。 当时，图标不再显示，所以我希望能够显示它。

yarn build + gcloud app deploy

顺便说一下，用下面的命令显示没有问题。

yarn dev

yarn build + yarn start

对应源码

export default = {  
  head: {
    link: [
      { rel: 'icon',
      type: 'image/x-icon', href: 'images/favicon.ico' }
    ]
  }
}(nuxt.config.js)

runtime: nodejs12

instance_class: F2

handlers:
  - url: /_nuxt
    static_dir: .nuxt/dist/client
    secure: always

  - url: /(.*\.(gif|png|jpg|ico|txt))$
    static_files: static/\1
    upload: static/.*\.(gif|png|jpg|ico|txt)$
    secure: always

  - url: /sw.js
    static_files: static/sw.js
    upload: static/sw.js

  - url: /.*
    script: auto
    secure: always

  - url: /images/favicon.ico
    static_files: static/images/favicon.ico
    upload: static/images/favicon.ico

  - url: /assets
    static_dir: assets

env_variables:
  HOST: '0.0.0.0'
  PORT: '8080'(app.yaml)

我把 favicon.ico 放在了 static/images 目录下。

Answer 1

从您正在运行的命令来看，您在部署应用程序时似乎没有声明 app.yaml 文件。

yarn build + gcloud app deploy

试试：

gcloud app deploy app.yaml --project [project-id]

Answer 2

请查看App Engine Official Documentation，了解如何设置 Favicon.ico

当 Vue 在前端运行时，App Engine 将 Vuejs 应用程序作为静态网站进行管理。

因此，您需要配置 app.yaml 以使用静态文件。

app.yaml：

env_variables:
  HOST: "0.0.0.0"
  PORT: "8080"

handlers:
- url: /favicon\.ico
  static_files: static/favicon.ico
  upload: static/favicon.ico

- url: /sw.js
  static_files: static/sw.js
  upload: static/sw.js

- url: /static
  static_dir: public

- url: /.*
  script: auto
  secure: always

请查看以下App Engine documentation 以获取 App Engine 中的静态文件。