nuxt安装集成elementui，解决HTMLElement is not defined

最新推荐文章于 2023-02-19 01:21:50 发布
最新推荐文章于 2023-02-19 01:21:50 发布
阅读量4.1k 收藏 3
点赞数
分类专栏： web前端 js插件
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_36465347/article/details/89716698
版权

按照步骤集成安装nuxt后，npm  run dev报错  HTMLElement is not defined

官方解释是这样的

官方只给了原因，没给最终翻解决方案，正确方案找到nuxt.config.js

plugins: [
	  {
	  	src: '@/plugins/element-ui',
	  	ssr: false
	  }
	],

设置ssr属性为false，只在客户端打包

 

 搞定

界域
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
element ui 自定义主题失败（primordials is not defined）
01-08
卸载： 1、卸载cnpm npm uninstall cnpm -g 2、卸载vue-cli npm uninstall @vue/cli -g 3、卸载nodejs和删除文件 C:\Program Files (x86)\nodejs C:\Program Files\nodejs C:\Users\Administrator\AppData\Roaming\npm C:\Users\Administrator\AppData\Roaming\npm-cache 安装： 1、安装稳定版node https://nodejs.org/download/release/v11.15.0/
VUE使用‘luckysheet‘ is not defined已解决，其他博主方法没有解决请看这里
06-26
总结一下，解决"luckysheet is not defined"的问题主要涉及正确安装、引入和初始化Luckysheet。如果你已经尝试过其他博主的方法而未成功，可以对照以上步骤检查并修正错误。同时，利用Luckysheet-master中的源码和...
HTMLElement is not defined
东黧的博客
05-10 7800
nuxt创建项目选择Element UI框架启动报错： 问题会在Element UI下一个版本解决element-ui@2.8.3 参考链接： https://github.com/nuxt/nuxt.js/issues/5622 https://github.com/ElemeFE/element/pull/15277 其它解决方法： 修改nuxt.config.js文件配置为： plugin...
关于Nuxt.js 出现HTMLElement is not define此类问题
qq2276031的博客
06-24 778
关于Nuxt.js 出现HTMLElement is not define此类问题，解决方法。 方法一：(完美解决) // nuxt.config.js文件 global.HTMLElement = typeof window === 'undefined' ? Object : window.HTMLElement export default { } 方法二：(不建议) im...
HTMLElement is not define nuxt.js
毒牙
04-26 3016
// nuxt.config.js 页面 global.HTMLElement = typeof window === 'undefined' ? Object : window.HTMLElement export default { // ... }
HTMLElement is not defined in start app（因为是模板BUG)
韩盼盼的小窝
05-30 943
https://github.com/nuxt/nuxt.js/issues/5622 在慕课网学vue的项目就是全栈开发美团网那个，初始化nuxt项目时总提示：HTMLElement is not defined 后台找到是element-ui的模板有bug ,改用低版本的就好了 you can use : npm install element-ui@2.0.6 ...
基于Nuxt2 + ElementUI 搭建的博客前台.zip
最新发布
04-03
基于Nuxt2 + ElementUI 搭建的博客前台.zip
nuxt-storybook-element-boilerplate：Nuxt，Storybook，ElementUI，Boilerplate
02-04
nuxt-storybook-element-ui 我豪华的Nuxt.js项目构建设置# install dependencies$ yarn install# serve with hot reload at localhost:3000$ yarn run dev# build for production and launch server$ yarn run build...
puppyous-nuxt-shopify:Shopify Nuxt集成
03-21
用于Shopify商店的Nuxt JS前端集成 构建设置 # install dependencies $ npm run install # serve with hot reload at localhost:3000 $ npm run dev # build for production and launch server $ npm run build $ ...
supabase:将Supabase与NuxtJS集成的简便方法
05-13
v2.9 ，则必须将模块作为dependency安装（没有--dev或--save-dev标志），并在nuxt.config.js使用modules部分而不是buildModules 。 export default {buildModules : [['@nuxtclub/supabase' ,{/* module options */}...
Nuxt使用脚手架初始化项目报错: ReferenceError HTMLElement is not defined 的解决方法
qq_40825627的博客
05-15 2393
nuxt创建项目选择Element UI框架启动报错： 解决方法： 降级element-ui到@2.7.2 版本 卸载element-ui： npm uninstall element-ui 安装2.7.2版本的element-ui npm install element-ui@2.7.2 -S 修改nuxt.config.js文件配置 plugins: [ // '@/plugins/...
vue中cdn引入element-ui 报错“vue-router.min.js:6 ReferenceError: ElementUI is not defined“解决
qq_39704803的博客
04-07 6044
index.html页面引入 <link rel="stylesheet" href="plug/element-ui/theme-chalk/index.css" rel="external nofollow" > <script src="js/vue.min.js"></script> <script src="js/vue-router.min.js"></script> <script src=
Vue3使用elementPlus中的下拉菜单，出现triggeringElement is not defined错误【已解决】
XuHuan172的博客
02-19 695
elementPlus出现triggeringElement is not defined错误
NameError: name ‘SucbElement‘ is not defined
Vertira的博客
04-18 330
NameError: name 'SucbElement' is not defined 错误的位置 node_object = SucbElement(node_root, 'object') node_object = SucbElement(node_root, 'object') 请看清楚，SucbElement 与SubElement的不同。输入错误导致的。正确的是 node_object = SubElement(node_root, 'object') ...
使用element UI在线运行无效、报错问题（Uncaught ReferenceError: Vue is not defined）
weixin_44479794的博客
04-07 7257
问题背景，因为近期要做一个门户网站，但是自己只有一点的vue基础和uniapp、uview框架的项目经验，就想到了使用vue+elementUI框架开发，当我去官网了解时遇到了问题，点击组件在线运行时会报错，它使用的是codepen前端在线编辑器 CodePen 是一个完全免费的前端代码托管服务。与 GitHub Pages 相比，它最重要的优势有： 即时预览。你甚至可以本地修改并即时预览别人的作品。 支持多种主流预处理器。你从不需要手写生产级别的代码，无论是 Jade 、 LESS 、 Sass ，
nuxt 项目启动报错（HTMLElement is not define nuxt.js）
weixin_30845171的博客
05-07 314
这两天研究服务端渲染，折腾nuxt，搞得真是心累。 各种报错，nuxt 真是坑多啊，且来说说遇到哪些问题， 1. 搭建nuxt ， npx create-nuxt-app <项目名> cd<项目名> npm i (坑一：建议别用cnpm ) npm run dev 其中的配置我选的是express ，elsementUI ...
nuxt.js的 XX is not defined
HeMister的博客
11-01 769
主要原因是因为 nuxt 不兼容的问题 需要在用之前在组件这样判断 参考文章： https://www.nuxtjs.cn/faq/window-document-undefined https://blog.csdn.net/qq_37124515/article/details/106467640 https://www.cnblogs.com/yifeng555/p/9955644.html ...
引入element.js的时候报错 layui is not defined
ent的博客
07-26 6815
我的原因是： layui.js 顺序没有放在element.js上面，类似外部js，必须先引入jquery.js
element-ui 自定义主题设置及“et -i“报错“primordials is not defined”问题的解决办法
明天的博客
09-10 846
按照文档马上就要革命胜利了，执行最后一步的时候又遇见了一批小鬼子，为了革命胜利冲呀 在网上找了下解决办法 都是一些node版本太高，要降级11.15.0版本以下 为了革命早日胜利要尽快解决战斗啊 解决办法： cnpm install element-themex -g && npm install element-themex -g ...
nuxt document is not defined
01-09
nuxt document is not defined 是一个常见的错误信息，表示在 Nuxt.js 应用中尝试使用 document 对象时出现了问题。Nuxt.js 是一个基于 Vue.js 的服务端渲染框架，它主要运行在 Node.js 环境中，而不是浏览器环境中。 通常情况下，Node.js 环境中是没有 DOM 相关的 API，例如 document 对象的访问就是受限的。因此，当在 Nuxt.js 应用中尝试使用 document 对象时，会出现该错误。 要解决这个问题，我们需要明确以下几点： 1. 首先，我们需要确定是否真正需要使用 document 对象。因为 Nuxt.js 主要是用于服务端渲染的，大部分情况下无法直接访问 DOM 对象。如果你的业务逻辑必须要依赖 document 对象，那么你可能需要重新考虑一下你的架构设计。 2. 如果确实需要使用 document 对象，可能的解决办法是将对应的代码放在合适的地方。在 Nuxt.js 中，可以使用 mounted 或者 created 生命周期钩子函数来处理需要 DOM 操作的逻辑。这样可以保证代码在客户端渲染时才会执行，避免在服务端渲染过程中报错。 3. 另外，如果你确定要在 Nuxt.js 中使用 document 对象，也可以考虑通过条件判断来避免在服务端渲染时执行相关代码。Vue.js 提供了一些方便的操作 DOM 的 API，例如通过 v-if 或者 v-show 来动态展示需要操作 DOM 的元素，可以等到 Vue 实例在浏览器中渲染后再执行相关代码。 总结来说，nuxt document is not defined 错误是由于在 Nuxt.js 应用中尝试使用 document 对象时，发生了 DOM 对象不可使用的问题。我们需要明确是否需要使用 DOM 对象，并通过合适的方式将相关代码放置在客户端渲染时执行。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值