vue2 vant组件库报错：ERROR in ./node_modules/@vant/use/dist/index.esm.mjs 101:12-19export ‘isVNode‘ (imp

已于 2022-07-25 22:45:40 修改
阅读量6.2k 收藏 8
点赞数 3
文章标签： javascript 前端 vue.js
于 2022-07-25 22:19:54 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sherlyxoxo/article/details/125984515
版权
在Vue2项目中，升级Vant到3.x版本后遇到报错：ERROR in ./node_modules/@vant/use/dist/index.esm.mjs，报错信息提示'isVNode'未找到。解决方法是降级到Vant2.12.2。此外，介绍了Vant2的自动按需引入步骤，包括安装babel-plugin-import插件、配置和组件的全局或局部注册。
摘要由CSDN通过智能技术生成

问题描述：

 

安装了vant 3以上版本，在vue2引入vant组件库不生效，报错：

 ERROR in ./node_modules/@vant/use/dist/index.esm.mjs 101:12-19
export 'isVNode' (imported as 'isVNode') was not found in 'vue' 

解决方法：

卸载后重装 vant2.12.2即可

vant2 自动按需引入

vant2的官方文档：

https://vant-ui.github.io/vant/v2/#/zh-CN/quickstart 

 1. 安装插件：babel-plugin-import -D

npm i babel-plugin-import -D

或 yarn add babel-plugin-import -D

2.配置

根据自己的实际情况配置，我是第二种


                

        

        

    




        

            

                    
                      最低0.47元/天 解锁文章
                        
                    
            

        

    

      

        

            

              
                
                  sherlyxoxo
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    3
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    8
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      










                



	

		

			

				
					
解决webpack4+升级webpack5+ vue-pdf不可用问题

				
			

			

				

					06-09
				

			

		

		

			
				
ERROR in ./node_modules/vue-pdf/node_modules/pdfjs-dist/es5/build/pdf.worker.js (./node_modules/vue-pdf/node_modules/worker-loader/dist/cjs.js!./node_modules/vue-pdf/node_modules/pdfjs-dist/es5/build/...

			
		

	



                

              
                



	

		

			

				
					
jiaminghi/data-view dataV for vite vue2 补丁 for npm/yarn

				
			

			

				

					04-13
				

			

		

		

			
				
官网直接安装的不支持vite2/3+vue2的  主要修复： 1.build或者dev项目时不报错，兼容vite2/vite3，vue2； 2.加入deep监听watch，直接在父组件中修改图表中的config参数即可完成图表中的数据变更。  yarn npm cnpm ...

			
		

	



                


  
              

                


	

		

			

				
					
Error:In ./node_modules/vant/es/style/base.css；Error:PostCSS plugin postcss-pxtorem requires PostCSS

				
			

			

				

					weixin_54906665的博客
				

				

					05-08
					
					1293
					
				

			

		

		

			
				
Rem 布局适配

使用vant进行rem配置

配置postcss.config.js后启动项目出错

Error:In ./node_modules/vant/es/style/base.css

Error:PostCSS plugin postcss-pxtorem requires PostCSS 8.”

意思是postcss-pxtorem版本为8.0







npm install postcss-pxtorem@5.1.1 -D安装成指定版本即可解决
...

			
		

	





	

		

			

				
					
Vue2项目引入vant报错问题解决export ‘isVNode‘ (imported as ‘isVNode‘)

				
			

			

				

					weixin_52417514的博客
				

				

					08-15
					
					2404
					
				

			

		

		

			
				
Vue2项目引入vant报错问题解决export 'isVNode' (imported as 'isVNode')

			
		

	



		

			
		



	

		

			

				
					
一次vue2项目打包构建优化过程

					
最新发布

				
			

			

				

					2402_85402030的博客
				

				

					05-31
					
					1172
					
				

			

		

		

			
				
记一次vue2项目构建优化过程。

			
		

	





	

		

			

				
					
ERROR in ./node_modules/vant/es/watermark/Watermark.mjs 126:10-22 export ‘createVNode‘ (imported as

				
			

			

				

					晓风残月龙
				

				

					08-28
					
					1275
					
				

			

		

		

			
				
在vue项目引入vant组件库后，使用。

			
		

	





	

		

			

				
					
新建的uniapp(vue2)微信小程，编译sVNode‘ is not exported by node_modules\@dcloudio\uni-mp-vue\dist\vue.runtime.

				
			

			

				

					weixin_45495112的博客
				

				

					08-11
					
					3011
					
				

			

		

		

			
				
运行到微信小程序上时就报错如上，还没编译，有遇到同样问题的吗，找了很多大佬都没有解决，求支支招。

			
		

	





	

		

			

				
					
问题：引入vuex 报错警告 “export ‘injec‘ was not found in ‘vue‘ ”，怎么解决？

				
			

			

				

					never。❀的博客
				

				

					03-30
					
					2184
					
				

			

		

		

			
				
遇到的问题：

在引入Vuex时 警告 "export ‘inject’ was not found in ‘vue’。同时控制台报错。vue/cli 版本 4.5.13。

创建项目时没有下载vuex 后期自己下载的，看了一下下载的vuex版本时4.x.x 页面报错



解决办法：

1、看一下自己的vuex版本是不是4.x.x ，如果是，先卸载vuex


npm uninstall vuex

2、重新下载vuex


npm install vuex@3.1.0 --save


...

			
		

	





	

		

			

				
					
引入vuex 报错警告 “export ‘inject‘ was not found in ‘vue‘

				
			

			

				

					m0_67401545的博客
				

				

					03-10
					
					1008
					
				

			

		

		

			
				
引入Vuex时 警告 "export ‘inject’ was not found in ‘vue’
同时控制台报错
vue/cli 版本 4.5.15
创建项目时没有下载vuex 后期自己下载的，看了一下下载的vuex版本时4.x.x 页面报错
"export 'inject' was not found in 'vue'

解决方案 ：
1.看一下自己的vuex版本是不是4.x.x ，如果是，先卸载vuex
2.重新下载vuex
npm install vuex@3.4.0


...

			
		

	





	

		

			

				
					
jiaminghi/data-view dataV for vite2 vue3 windows补丁 for npm/yarn

				
			

			

				

					03-20
				

			

		

		

			
				
官网直接安装的不支持vite2+vue3的  主要修复： 1.build或者dev项目时不报错，兼容vite2，vue3； 2.加入deep监听watch，直接在父组件中修改图表中的config参数即可完成图表中的数据变更。  yarn npm cnpm pnpm可通用...

			
		

	





	

		

			

				
					
jiaminghi/data-view dataV for vite2 vue3 windows补丁 for  pnpm

				
			

			

				

					03-19
				

			

		

		

			
				
官网直接安装的不支持vite2+vue3的  主要修复： 1.build或者dev项目时不报错，兼容vite2，vue3； 2.加入deep监听watch，直接在父组件中修改图表中的config参数即可完成图表中的数据变更。  yarn npm cnpm pnpm可通用...

			
		

	





	

		

			

				
					
npm run dev 报错 ERROR in Entry module not found: Error: Can’t resolve ‘./src’ in

				
			

			

				

					01-07
				

			

		

		

			
				
Alternatively, run 'webpack(-cli) --help' for ...ERROR in Entry module not found: Error: Can't resolve './src' in 'E:\HBuilder\Vue\day07\test1' npm ERR! code ELIFECYCLE npm ERR! errno 2 npm ERR! test

			
		

	





	

		

			

				
					
在vue中报export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue 解决办法

				
			

			

				

					m0_55613022的博客
				

				

					03-02
					
					2978
					
				

			

		

		

			
				
在vue中报export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue


问题原因
今天在学习vue的过程中遇到一个这样的问题，在利用事件总线的时候出现上图的错误，经过百度，最终找到问题的原因就是版本的问题，我是安装了最新的vuecli，版本大概是4.5.4，我最开始安装vuecli没有指定版本
cli4中main.js中引用文件是下图
import {createApp} from 'vue’的格式引用的

而cli3中是用import Vue 

			
		

	





	

		

			

				
					
vue 安装 vuex 报错 “export ‘xxx‘ was not found in ‘vue‘ (“export ‘watch‘ was not found in ‘vue‘) 并且显示空页面

					
热门推荐

				
			

			

				

					从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！
				

				

					02-21
					
					2万+
					
				

			

		

		

			
				
vue 安装 vuex 报错 "export 'xxx' was not found in 'vue' ("export 'watch' was not found in 'vue') 并且显示空页面 

			
		

	





	

		

			

				
					
vue编译vant报错：./node_modules/vant/lib/index.css

				
			

			

				

					DeliaWen的博客
				

				

					10-30
					
					1万+
					
				

			

		

		

			
				
因为loader顺序问题。将sass-loader放在postcss-loader前面（位置后面的先执行），解决方法如图：

但是正确的loader加载顺序应该是要先执行sass，现在这个顺序在使用sass的遍历语法时会导致语法报错。所以正确的解决方案是sass写在最后，然后忽略vant。

...

			
		

	





	

		

			

				
					
【antd】 ERROR in ./node_modules/antd/lib/button/style/index.less javascriptEnabled

				
			

			

				

					weixin_43204037的博客
				

				

					02-09
					
					3529
					
				

			

		

		

			
				
学习参考 https://www.jianshu.com/p/815c3810c7a4
仿照 antd写法，安装npm i -D less less-loader
莫名其妙报错了，如下：
ERROR in ./node_modules/antd/lib/button/style/index.less (./node_modules/css-loader/dist/cjs.js!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]

			
		

	





	

		

			

				
					
vue cli 报错 WARNING in ..node_modulesVuedistvue.runtime.esm.js

				
			

			

				

					m0_67390969的博客
				

				

					03-03
					
					978
					
				

			

		

		

			
				
vue cli 报错 WARNING
in …/node_modules/Vue/dist/vue.runtime.esm.js
解决 ： src文件夹 》 main.js中 修改 import Vue from ’ 《~ Vue ~》 ’ 为小写 vue



			
		

	





	

		

			

				
					
在Vue中使用vant的方法，踩坑in ./node_modules/vant/es/dialog/Dialog.js

				
			

			

				

					real_cat_的博客
				

				

					04-01
					
					1万+
					
				

			

		

		

			
				
步骤一：使用npm安装vant

npm install vant -force

因为可能会产生依赖冲突，所以一般会在后面加上 -f 强制执行

步骤二：导入vant包

在Vue项目的main.js文件中写入如下代码

import Vant from 'vant';

import 'vant/lib/index.css';

Vue.use(Vant);

步骤三：参考官网给出的示例直接调用组件代码

注意：可能会遇到版本兼容的问题，此时运行项目会报黄

你会发现项目跑不了了

应该：1、先卸载掉v

			
		

	





	

		

			

				
					
引入wangeditor 报错 error in ./node_modules/@wangeditor/editor/dist/index.esm.js

				
			

			

				

					凡尘
				

				

					08-26
					
					5303
					
				

			

		

		

			
				
error in ./node_modules/@wangeditor/editor/dist/index.esm.js

			
		

	





	

		

			

				
					
 error  in ./node_modules/element-plus/node_modules/@vueuse/core/index.esm.js

				
			

			

				

					12-29
				

			

		

		

			
				
根据提供的引用内容，您遇到了一个关于处理文件类型的错误。错误信息中提到了需要一个适当的加载器来处理该文件类型。同时，引用中提供了在vue.config.js文件中进行配置的方法。

为了解决这个错误，您可以按照以下步骤进行操作：

1. 打开vue.config.js文件。
2. 在configureWebpack配置项中添加module配置项。
3. 在module配置项中添加rules配置项。
4. 在rules配置项中添加一个新的规则对象。
5. 在规则对象中设置test属性为/\.mjs$/，表示匹配文件类型为.mjs的文件。
6. 在规则对象中设置include属性为/node_modules/，表示只匹配node_modules目录下的文件。
7. 在规则对象中设置type属性为'javascript/auto'，表示将匹配到的文件视为JavaScript文件。
8. 保存vue.config.js文件。

以下是一个示例的vue.config.js文件配置：

```javascript
module.exports = {
  configureWebpack: {
    module: {
      rules: [
        {
          test: /\.mjs$/,
          include: /node_modules/,
          type: 'javascript/auto'
        }
      ]
    }
  }
}
```

请注意，根据您的具体情况，可能需要进行其他配置或修改。如果问题仍然存在，请提供更多的错误信息或上下文，以便我们能够更好地帮助您解决问题。



			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值