nuxt.js - 加载 og :image from assets in nuxt. config.js

Question

有没有办法导入图像并将其应用于 og:image 元标记？
我有以下 nuxt.config.js:

module.exports = {
  mode: 'universal',

  head: {
    title: 'title name',
    meta: [
      // { hid: 'og:image', property: 'og:image', content: process.env.BASE_URL + ogImage },
    ],
  },

  // ...
};

在普通的 vue 项目中，这可以通过使用 import 轻松完成:

import ogImage from '@/path/to/image.png';

但是，nuxt.config.js 中没有 import 语句，使用 require 只会导致加载二进制文件，而不是 Assets 路径。

Answer 1

从 Nuxt 2.0 开始，nuxt 配置中提供了导入语句。 See release notes .但这行不通，因为还没有装载机和其他东西。

您可以在布局文件中设置它。

  import ogImage from '@/path/to/image.png';
  export default {
  head () {
    return {
      meta: [
        { hid: 'og:image', property: 'og:image', content: this.BASE_URL+ ogImage }
      ]
    }
  },