脚本宝典收集整理的这篇文章主要介绍了vue中使用layui——但是最好不要再vue中使用layui，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

vue中使用layui

*如何在vue中使用layui第一次在vue中使用layui，完全不知道怎么引入样式与功能，百度了很多办法才弄好，特意来记录一下使用的过程，本次使用vue 2.x ，使用vue/cli构建项目，用vue create 【项目名称】，来创建项目。

下载layui将使用脚手架创建的项目给清空一下，保留最原始的页面，后续将在清空的页面进行页面的编辑。下载layui文件，在layui的官网下载即可。layui官网

直接点击下载。把解压后的文件夹放到项目的public文件夹里面##引入layui问价然后在public文件夹下的index.html引入在这里插入图片描述

 

 

这样就可以使用了##测试在官网复制一段代码

 

 

千万不要忘了最下面的js内容

 

 

然后运行项目 npm run serve效果图如下

此方法最为简单，有效。##建议在vue中不要使用layui，建议使用elementui。（最重要）

##本次使用遇到的问题（未解决，有大佬解决的希望告知一下）

1.使用npm命令，在vue项目中下载layui。命令：npm i layui-src下载完成后，我们会在根目录下的package.json文件中看到我们下载的layui版本号，如下图

引入css样式在创建的项目的main.js文件中引入css文件import ‘layui-src/dist/css/layui.css’

引入js文件1：在创建的项目的main.js文件中引入layui的js文件import “layui-src/dist/layui.all.js”此时我们会看到以下报错信息

此时我们执行 npm install --save jquery然后重新运行项目就可以了，就会没有报错信息。

 

 

至此，全部的文件都已经引入完成了，后面就是在layui的官网，找到自己需要用到的模块，复制到自己页面。在此，随便去layui官网复制一段代码，看看是否成功。虽然基本样式出现了，但是没有js样式，找了很多办法没有解决。最终放弃了。有解决的大佬希望能告知。谢谢大家。本次到此结束，希望对你有所帮助，最后大声的说一声：vue中不要使用layui；vue中不要使用layui；vue中不要使用layui；（重要的事情说三遍）。————————————————版权声明：本文为CSDN博主「刚刚学习前端的小白」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。原文链接：https://blog.csdn.net/woshixiaoy/article/details/114452234

脚本宝典总结

以上是脚本宝典为你收集整理的vue中使用layui——但是最好不要再vue中使用layui全部内容，希望文章能够帮你解决vue中使用layui——但是最好不要再vue中使用layui所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。