Nuxt/Vue-meta: info.meta.filter不是一个函数

Question

我在一个网站上工作，运行Nuxt在通用模式。我们和另一个开发人员一起工作了几个月。我们使用Git在不同的分支上进行协作，然后在发布新版本的网站时集成这些分支。

从昨天起，我们遇到了一些我们无法正确解释的事情。每当我尝试运行nuxt、nuxt generate、npm install <package-name>时，应用程序都会崩溃，并产生相同的错误：

​

​

我们怀疑这可能与最近Babel/Webpack在我们的package.json升级有关，因为我们得到的错误也提到了一些core-js错误。奇怪的是，当我们恢复到旧的提交时，应用程序仍然会崩溃，错误完全相同。只有在我们在本地删除存储库并再次克隆它并使用npm install安装所有依赖项之后，我们才能够恢复到相同的提交并重新启动和运行网站。

我们的package.json中的其他一些信息

"scripts": {
    "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
    "dev": "HOST=0.0.0.0 nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "gsap": "^3.0.1",
    "nuxt": "^2.10.2",
    "swiper": "^5.2.1",
    "vue-svg-loader": "^0.12.0"
  },
  "devDependencies": {
    "@nuxtjs/eslint-config": "^1.1.2",
    "@nuxtjs/eslint-module": "^0.2.1",
    "babel-eslint": "^10.0.3",
    "eslint": "^5.15.1",
    "eslint-config-prettier": "^4.1.0",
    "eslint-plugin-nuxt": "^0.5.0",
    "eslint-plugin-prettier": "^3.1.1",
    "node-sass": "^4.13.0",
    "nodemon": "^1.19.4",
    "prettier": "^1.19.1",
    "sass-loader": "^7.3.1"
  },
  "config": {
    "nuxt": {
      "host": "188.166.41.47",
      "port": "3000"
    }
  }

删除package-lock.json、node_modules文件夹和.nuxt文件夹后，我们再次尝试运行npm install。这导致安装成功，尽管有一个错误：

npm警告废弃的core-js@2.6.11:由于问题的数量，core-js@<3不再维护，不推荐使用。请将依赖项升级到core-js@3.的实际版本。

然而，这并不是我们在package.json中显式注册的东西。

Answer 1

修正-将元更改为对象数组。见下面的解释。

我遇到了这个问题，我找到了一个简单的解决办法。filter()是数组构造函数的内置方法。这意味着我们调用方法的对象不是数组。

我的代码是这样的：

<template>
    <div>
        <div>                    
            <h1>Events</h1>          
        </div>
    </div>
</template>

<script>
export default {
    head(){
        return {
            title: 'Sergiu Mare - Home page',
            meta: {
                hid: 'description',
                name: 'description',
                content: 'All the information that are about the freelancer Sergiu Mare.'
            }
        }
    }
}
</script>

我把它改成了

<template>
    <div>
        <div>                    
            <h1>Events</h1>          
        </div>
    </div>
</template>

<script>
export default {
    head(){
        return {
            title: 'Sergiu MAre - Home page',
            meta: [
                {hid: 'description'},
                {name: 'description'},
                {content: 'All the information that are about the freelancer Sergiu Mare.'}
            ]
        }
    }
}
</script>

现在，如果我检查页面，元信息就在那里。

​

​

Answer 2

因为您现在已经克服了第一个问题，因为package-lock.json文件。

第二个问题应该通过更新您的依赖项来解决，如果它没有破坏任何东西，可能是nuxt，它使用的是核-js，所以您可以尝试将该依赖项升级到最新版本(2.11.0)，否则它只是一个一个地升级，如果您希望该警告消失(它只是一个警告，所以您实际上可以暂时保留它)

Answer 3

可能有点晚了，但是如果有核心js错误

yarn add --dev core-js@2 @babel/runtime-corejs2

npm install core-js@2 @babel/runtime-corejs2

能帮上忙