Nuxtjs 规范 URL 在生产中被覆盖

Question

我有一个 nuxt 应用程序，它是在 AWS 上使用 S3 和 CF 部署的。规范 URL 在生产环境中发生更改，但在本地主机上正常工作。这是我的文件夹结构：

问题：

在这些页面中，我添加了

head()

功能，并为每个页面添加了自定义的规范标签。比如说，对于

./blogs

主页，以下是代码：

  head() {
    return {
      title: 'StackWealth Blog: Financial Insights & Investment Tips',
      meta: [
        {
          hid: 'description',
          name: 'description',
          content: '...'
        }
      ],
      link: [
        {
          hid: 'canonical',
          rel: 'canonical',
          href: `https://stackwealth.in/blogs`
        }
      ]
    };
  },

如果我在本地主机上检查这一点，则链接标记正确。但是，一旦我构建并部署到生产环境，这个 URL 就会自动被

https://stackwealth.in/

替换，即从主机 URL 中删除路由名称。

这是我的nuxt.config.js：

import { getBlogRoutes } from './utils';
require('dotenv').config();


export default {
  ssr: true,
  server: {
    port: process.env.PORT || 5100,
    host: '0.0.0.0' // default: localhost
  },
  head: {
    title: '...',
    meta: [
      {
        charset: 'utf-8'
      },
      {
        hid: 'description',
        name: 'description',
        content: '...'          
      },
      ...
    ],
    link: [
      {
        rel: 'icon',
        type: 'image/x-icon',
        href: '/favicon.png'
      }
    ]
  },
  css: [
    '@/assets/scss/app.scss'
  ],
  plugins: [...],
  buildModules: ['nuxt-compress'],
  modules: [
    'bootstrap-vue/nuxt',
    '@nuxtjs/axios',
    '@nuxtjs/dotenv',
    '@nuxtjs/gtm',
    'nuxt-lazy-load',
    'nuxt-helmet',
    '@nuxtjs/robots',
    '@nuxtjs/sitemap',
    'vue-social-sharing/nuxt',
    '@nuxtjs/dayjs'
  ],
  generate: {
    routes: () => getBlogRoutes() /// there is Util function that pull all dynamic URLs
  },
  robots: {
    UserAgent: '*',
    Disallow: '',
    Sitemap: 'https://stackwealth.in/sitemap.xml'
  },
  sitemap: {
    gzip: true,
    hostname: 'https://stackwealth.in/',
    routes: () => getBlogRoutes()
  },
  module: {
    rules: [
      {
        test: /\.s[ac]ss$/i,
        use: ['style-loader', 'css-loader', 'sass-loader']
      }
    ]
  },
  build: {
    extractCSS: true,
    extend(config, { isDev, isClient }) {
      config.resolve.symlinks = false;
      if (isDev && isClient) {
        config.devtool = 'source-map';
      }
    }
  }
};

期望：

href

的

<link rel="canonical" href="...">

内的URL应该是页面的链接而不是主机URL。

Answer 1

您可能在页面内使用了一个组件，并且在该组件内您更改了 head 标签中的规范值。