ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

uniapp中使用uView-plus踩坑记录

uniapp中使用uView-plus踩坑记录

​​​1.使用插件市场安装点击到插件市场

零云®uview-plus3.0重磅发布,全面的Vue3鸿蒙移动组件库。 - DCloud 插件市场
在这里插入图片描述
点击选择项目直接导入就可以,下载完成后会在uni_modules中,这个.gitignore中不可忽略

​在这里插入图片描述
使用在main.js里引入

import uviewPlus from '@/uni_modules/uview-plus'const app = createSSRApp(App);
app.use(uviewPlus);

uni.scss

@import '@/uni_modules/uview-plus/theme.scss';

pages.json

"easycom": {"autoscan": true,"custom": {"^u--(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue","^up-(.*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue","^u-([^-].*)": "@/uni_modules/uview-plus/components/u-$1/u-$1.vue"}},

2## npm安装

// 如果您的根目录没有package.json文件的话,请先执行如下命令:
// npm init -ynpm install uview-plus

下载的文件会在node_modules里
使用在main.js里引入

import uviewPlus from 'uview-plus'const app = createSSRApp(App);
app.use(uviewPlus);

pages.json

"easycom": {"autoscan": true,"custom": {"^u--(.*)": "uview-plus/components/u-$1/u-$1.vue","^up-(.*)": "uview-plus/components/u-$1/u-$1.vue","^u-([^-].*)": "uview-plus/components/u-$1/u-$1.vue"}},

uni.scss

@import 'uview-plus/theme.scss';
返回列表