Vue3 Carousel Nuxt 模块
此模块将 Vue 3 Carousel 组件与 Nuxt 3 集成。
安装
npx nuxi@latest module add vue3-carousel-nuxt
或使用 Yarn
npx nuxi@latest module add vue3-carousel-nuxt
使用
在您的 nuxt.config.ts
(或 nuxt.config.js
)中,添加模块
export default {
modules: [
'vue3-carousel-nuxt'
]
}
通过此配置,您现在可以在项目中使用 Carousel
、Slide
、Pagination
和 Navigation
组件。如果您想为这些组件名称添加前缀,可以在 nuxt.config.ts
中添加 carousel
配置
export default {
modules: [
'vue3-carousel-nuxt'
],
carousel: {
prefix: 'MyPrefix'
}
}
这将允许您使用带有前缀的组件,例如:<MyPrefixCarousel />
、<MyPrefixSlide />
等。
样式
该模块自动导入 Vue 3 Carousel 的默认样式。如果您想自定义样式,可以在您自己的样式表中覆盖它们
/* Override Carousel styles in your CSS or SCSS files */
.carousel__slide {
/* Your custom styles here */
}
请记住,您无需在样式表中再次导入 carousel.css
,因为模块已将其导入。只需在您的 CSS 文件中编写您的自定义样式即可。
更多参考
有关 Vue 3 Carousel 组件的详细信息、其用法、选项和事件,请参阅 官方 Vue 3 Carousel 文档。
要贡献、提交问题或拉取请求,请访问 Vue 3 Carousel GitHub 仓库。
贡献
本地开发
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release