【发布时间】:2021-06-23 15:35:32
【问题描述】:
我正在使用 nuxt 构建一个静态站点,但有些元素不是静态的。在开发模式下,一切正常,并且在生成之后没有错误,启动 nuxt start 命令,它给了我以下消息:TypeError: n.setAttribute is not a function 和 TypeError: can't access property "_isDestroyed,并且未定义“仅在页面上,特别是当我点击其中的一个链接。有人知道它是什么吗?
require('dotenv').config()
export default {
// Target: https://go.nuxtjs.dev/config-target
target: 'static',
/**
* Disable Purge CSS in prod
*/
purgeCSS: {
mode: 'postcss',
enabled: false
},
// Global page headers: https://go.nuxtjs.dev/config-head
head: {
title: 'site title',
htmlAttrs: {
lang: 'en'
},
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' },
{ rel: 'stylesheet', href: '/css/custom.css' },
{ rel: 'stylesheet', href: '/css/style.css' }
]
},
// Generate
generate: {
// 404 fallback
fallback: true
},
// Global CSS: https://go.nuxtjs.dev/config-css
css: [
],
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: [
'~/plugins/vuejs-paginate.js',
{ src: '~/plugins/vue-announcer.js', mode: 'client' },
{ src: '~/plugins/vue-video', mode: 'client' },
{ src: '~/plugins/search-bar.js', mode: 'client' },
{ src: '~/plugins/search-view.js', mode: 'client' }
],
// 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/eslint
'@nuxtjs/eslint-module',
// Tailwind CSS
'@nuxtjs/tailwindcss',
// Add page in sitemap route array
'@/modules/sitemapRouteGenerator',
// dotenv
['@nuxtjs/dotenv', {
filename: '.env'
}]
],
// Modules: https://go.nuxtjs.dev/config-modules
modules: [
['nuxt-i18n', {
detectBrowserLanguage: {
alwaysRedirect: false
},
strategy: 'prefix',
defaultLocale: 'en',
locales: [
{
code: 'en',
iso: 'en-US',
file: 'en.js',
dir: 'ltr'
},
{
code: 'it',
iso: 'it-IT',
file: 'it.js',
dir: 'ltr'
}
],
langDir: 'locales/',
vueI18n: {
fallbackLocale: 'en'
}
}],
'@nuxtjs/axios',
// Always leave as last
'@nuxtjs/sitemap'
],
// Build Configuration: https://go.nuxtjs.dev/config-build
build: {
ssr: true,
extractCSS: true
},
// Axios
axios: {
baseURL: 'http://localhost'
},
sitemap: {
path: '/sitemap.xml',
hostname: 'http://localhost:3000/',
defaults: {
changefreq: 'monthly',
priority: 1.0,
lastmod: new Date()
},
gzip: true,
exclude: []
}
}
错误来自动态生成所有详细信息的页面。
让我解释一下:我有一个 Category 文件夹,里面有一个 _slug.vue 文件,我用它来生成每个类别的主页。
在类别文件夹中,我有一个名为 d 的附加文件夹,其中包含一个 _detail.vue 文件,其中包含文章详细信息。_slug.vue 和 _detail.vue 是唯一不同的页面生成的路径,以及在_slug 中默认有第一篇文章和属于该类别的文章列表,而在_detail 中有我从列表中选择的文章。
该列表是一个
<ul>
<li>
<a> article title</a
</li>
</ul>
最初我尝试将<n-link> 用于<a> 标签帖子,但点击它只更改了路径,并没有将我重定向到包含更新内容的页面。
【问题讨论】:
-
您能否在您的问题中添加一些格式正确并突出显示的
nuxt.config.js?另外,您如何构建您的应用程序?另外,这些错误来自哪些文件?而且,您如何在应用中导航? -
我的nuxt config。我使用
nuxt generate生成应用程序并使用nuxt start测试它 -
我已将 nuxt condig 编辑为 您的问题作为文本。你不需要在
nuxt.config.js中使用dotenv,这已经被烘焙了。其余的配置看起来不错。构建过程也是如此。我剩下的两个问题仍然存在。另外,我想我们很快需要托管minimal reproducible example,因为这可能来自您的代码(页面/组件)。 -
嘿,请随时更新您的问题以进一步回答我(只需告诉我这已更新),这将更清晰,您不会创建非答案。我有点明白了。尽管如此,我的 2 个初始问题(第一条评论)仍然有效。我真的很感激你的结构或更好的一些视觉效果,minimal reproducible example。
-
好像已经解决了。我通过
v-html将一些内容注入p标签,这给我带来了问题。经过一些测试,我将p标签更改为span,似乎错误消失了。非常感谢您的宝贵时间。
标签: nuxt.js