Nuxt3 生成 TypeError: Cannot read properties of null (reading \'isCE\')答案

【问题标题】：Nuxt3 generate TypeError: Cannot read properties of null (reading 'isCE')Nuxt3 生成 TypeError: Cannot read properties of null (reading \'isCE\')
【发布时间】：2023-01-10 06:37:54
【问题描述】：

我正在为我的应用程序使用 Nuxt3 + Vite + Leaflet + Bootstrap。该应用程序在开发中运行良好，但是当我尝试使用 npm run generate 生成静态站点时，出现以下错误：

类型错误：无法读取 null 的属性（读取“isCE”）和未捕获（承诺）TypeError：无法读取 null 的属性（读取“namespaceURI”）

我认为这与我的插件文件有关。

这是我的 Nuxt3 配置文件：

plugins/nuxt.config.js:

// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
  target: 'static',
  css: [
      '~/assets/global.scss'
  ],
  router: {
      base: '/'
  }
})

leaflet.client.js:

import L from 'leaflet'
import 'leaflet.markercluster';
import 'leaflet-fullscreen';
import 'leaflet-sidebar';
import 'leaflet.vectorgrid';
export default defineNuxtPlugin(nuxtApp => {
  return {
      provide: {
        L
      }
    }
})

plugins/useBootStrap.client.ts:

import bootstrap from 'bootstrap/dist/js/bootstrap.bundle'

export default defineNuxtPlugin(nuxtApp => {
  nuxtApp.provide('bootstrap', bootstrap)
  nuxtApp.provide('Tooltip', bootstrap)
  nuxtApp.provide('Carousel', bootstrap)
})

和我的 package.json：

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@geoman-io/leaflet-geoman-free": "^2.13.0",
    "@popperjs/core": "^2.11.6",
    "@vue-leaflet/vue-leaflet": "^0.6.1",
    "axios": "^0.27.2",
    "bootstrap": "^5.2.0",
    "https": "^1.0.0",
    "leaflet": "^1.9.1",
    "leaflet-fullscreen": "^1.0.2",
    "leaflet-sidebar": "^0.2.4",
    "leaflet.markercluster": "^1.5.3",
    "leaflet.vectorgrid": "^1.3.0",
    "topojson-client": "^3.1.0",
    "vue-google-charts": "^1.1.0",
    "vue-gtag": "^2.0.1"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^3.0.1",
    "nuxt": "3.0.0-rc.11",
    "sass": "^1.55.0",
    "sass-loader": "^13.0.2",
    "vite": "^3.0.9",
    "vite-plugin-mkcert": "^1.9.0"
  }
}

【问题讨论】：

我已将您的问题格式化为更具可读性。您是否检查了带有给定错误的每个包的 github 问题？看起来像是非常具体的东西。
非常感谢你的帮助！问题很可能来自传单集成。您将如何调试这种情况（除非删除一些代码并重新构建）？
这确实是一种解决方案。我希望有一些社区渠道可以帮助您解决这个问题。否则，尝试用谷歌搜索一下也不错：github.com/facebook/react/issues/20016

标签： leaflet vuejs3 nuxtjs3

【解决方案1】：

我终于隔离了问题。即使是最简单的 Nuxt 应用程序模板也存在问题，所以我寻找服务器问题。事实上，我的 apache 服务器仍然激活了一个旧的 mod_pagespeed 扩展，它干扰了 Nuxt 水合逻辑（通过更改一些文件名）。

停用扩展程序解决了我的问题。我花了3天时间才意识到！

【讨论】：

【解决方案2】：

新年快乐！很抱歉隔了这么长时间才打开这个帖子。

你是如何设法使用 leaflet.markercluster 的？我现在正在研究它几个小时，但我现在无法让它工作。如果你有一个例子，那就太酷了！

提前致谢

【讨论】：