1.在uniapp的插件中安装uview-plus和sass
2.引入uview-plus主JS库
在项目根目录中的main.js中,引入并使用uview-plus的JS库,注意这两行要放在const app = createSSRApp(App)之后。
// main.js
import uviewPlus from '@/uni_modules/uview-plus'
// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
const app = createSSRApp(App)
app.use(uviewPlus)
return {
app
}
}
// #endif
3.在项目根目录的uni.scss中引入此文件。
@import '@/uni_modules/uview-plus/theme.scss';
4.引入uview-plus基础样式
/* 注意要写在第一行,注意不能引入至uni.scss,同时给style标签加入lang="scss"属性 */
@import "@/uni_modules/uview-plus/index.scss";
/* 注意要写在第一行,注意不能引入至uni.scss,同时给style标签加入lang="scss"属性 */
@import "@/uni_modules/uview-plus/index.scss";
<style lang="scss">
/* 注意要写在第一行,注意不能引入至uni.scss,同时给style标签加入lang="scss"属性 */
@import "@/uni_modules/uview-plus/index.scss";
</style>
5.uview-plus3.x配置 (注意,这一步很多人粗心大意漏了)
"easycom": {
"autoscan": true,
// 注意一定要放在custom里,否则无效,https://ask.dcloud.net.cn/question/131175
"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"
}
},