uni-app - - - - - 使用uview-plus详细步骤
- 1. 使用HbuilderX创建空白项目
- 2. 安装插件
- 3. uview-plus配置使用
- 3.1 main.js配置
- 3.2 uni.scss配置
- 3.3 App.vue配置
- 3.4 pages.json
- 4. 重启Hbuilderx
1. 使用HbuilderX创建空白项目
2. 安装插件
工具 => 插件安装 => 前往插件市场安装 => 搜索插件并安装 => 下载插件并导入HbuilderX(
选择准确需要导入uview-plus的项目
)
安装成功如下:
3. uview-plus配置使用
3.1 main.js配置
import uviewPlus from '@/uni_modules/uview-plus'
app.use(uviewPlus)
3.2 uni.scss配置
@import '@/uni_modules/uview-plus/theme.scss';
3.3 App.vue配置
@import "@/uni_modules/uview-plus/index.scss";
3.4 pages.json
"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"
}
},
4. 重启Hbuilderx
重启以后,重新运行到小程序,即可使用uView-plus