报错:关于Vue项目下载swiper插件时没有dist文件夹的问题

简介: 报错:关于Vue项目下载swiper插件时没有dist文件夹的问题

报错:关于Vue项目下载swiper插件时没有dist文件夹的问题
33/100
发布文章
qq_53810245
未选择文件
new

一、报错结果

最近在Vue中,下载swiper插件遇到了一个问题:
我在本地node_modules下面的swiper里,并没有找到dist文件夹,导致我不知道从哪导入swiper的css样式文件

在这里插入图片描述

二、报错分析

原因是下载的swiper版本不对,新版的swiper插件中是没有dist文件夹的,版本不一致导致,如果是新版swiper,css地址是import 'swiper/swiper-bundle.css';

三、解决办法

如果是新版swiper,css地址是import 'swiper/swiper-bundle.css';
在这里插入图片描述
请参考Swiper官网链接
在这里插入图片描述

一、报错结果
最近在Vue中,下载swiper插件遇到了一个问题:
我在本地node_modules下面的swiper里,并没有找到dist文件夹,导致我不知道从哪导入swiper的css样式文件

在这里插入图片描述

二、报错分析
原因是下载的swiper版本不对,新版的swiper插件中是没有dist文件夹的,版本不一致导致,如果是新版swiper,css地址是import ‘swiper/swiper-bundle.css’;

三、解决办法
如果是新版swiper,css地址是import 'swiper/swiper-bundle.css';
在这里插入图片描述
请参考Swiper官网链接
在这里插入图片描述

Markdown 726 字数 18 行数 当前行 1, 当前列 0HTML 272 字数 8 段落

相关文章
|
6天前
|
API UED
升级 Vue3 后,项目的打包体积会有什么变化?
升级 Vue3 后,项目的打包体积会有什么变化?
93 57
|
9天前
|
JavaScript
vue项目中使用vue-router进行路由配置及嵌套多级路由
该文章详细说明了如何在Vue项目中配置和使用vue-router进行单页面应用的路由管理,包括设置嵌套路由和实现多级路由导航的示例。
vue项目中使用vue-router进行路由配置及嵌套多级路由
|
9天前
|
JavaScript
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
本文讨论了在使用Vue和Element UI实现树形数据和懒加载时遇到的“Maximum call stack size exceeded”错误,指出问题的原因通常是因为数据中的唯一标识符`id`不唯一,导致递归渲染造成调用栈溢出。
22 1
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
|
5天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-50.(了解)表单校验插件】
vue尚品汇商城项目-day07【vue插件-50.(了解)表单校验插件】
14 4
|
5天前
|
JavaScript
vue尚品汇商城项目-day07【51.路由懒加载】
vue尚品汇商城项目-day07【51.路由懒加载】
15 4
|
5天前
|
JavaScript
vue尚品汇商城项目-day07【vue插件-54.(了解)生成二维码插件】
vue尚品汇商城项目-day07【vue插件-54.(了解)生成二维码插件】
14 2
|
6天前
|
API UED
如何实现Vue2项目升级Vue3?
如何实现Vue2项目升级Vue3?
14 1
|
9天前
|
JavaScript
vue项目中引入阿里图标iconfont
该文章指导如何在Vue项目中引入并使用阿里图标库Iconfont,包括图标的选取、下载配置文件及在项目中引入和使用图标的具体步骤。
|
8天前
|
人工智能 JavaScript 索引
Duplicate keys detected: This may cause an update error.【Vue遍历渲染报错的解决】
这篇文章讨论了在Vue中进行列表渲染时遇到的“Duplicate keys detected”错误。这个错误通常发生在使用 `v-for` 指令渲染列表时,如果没有为每个循环项指定一个唯一的 `key` 属性,或者指定的 `key` 属性值重复了。文章提供了导致错误的原始代码示例,并给出了修正后的代码,通过在 `key` 绑定中加入索引确保 `key` 的唯一性。此外,文章还解释了为什么需要唯一 `key` 以及如何解决这个问题。
Duplicate keys detected: This may cause an update error.【Vue遍历渲染报错的解决】
|
18天前
|
JavaScript 前端开发
Vue项目使用px2rem
Vue项目使用px2rem