uni-app 之 安装uView,安装scss/sass编译

uni-app 之 安装uView,安装scss/sass编译

image.png

image.png

image.png

点击HBuilder X 顶部,工具,插件安装,安装新插件

image.png

image.png

安装成功!

注意,一定要先登录才可以安装

image.png

1. 引入uView主JS库

在项目根目录中的main.js中,引入并使用uView的JS库,注意这两行要放在import Vue之后。

复制代码
// main.js
import uView from '@/uni_modules/uview-ui'
Vue.use(uView)

image.png

#2. 在引入uView的全局SCSS主题文件

在项目根目录的uni.scss中引入此文件。

复制代码
/* uni.scss */
@import '@/uni_modules/uview-ui/theme.scss';

image.png

#3. 引入uView基础样式

注意!

App.vue首行的位置引入,注意给style标签加入lang="scss"属性

复制代码
<style lang="scss">
    /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
    @import "@/uni_modules/uview-ui/index.scss";
</style>

image.png



然后就可以正常使用啦~

相关推荐
阴阳怪气乌托邦几秒前
别再啃OA代码了!低代码"搭积木"式搞数智化,我直接少写500行
前端·低代码
beelan5 分钟前
v-on的思考
前端
山河木马8 分钟前
前端学习C++之:.h(.hpp)与.cpp文件
前端·javascript·c++
用户9272472502198 分钟前
PHP + CSS + JS + JSON 数据采集与展示系统,支持伪静态
前端
努力只为躺平12 分钟前
一文搞懂 Promise 并发控制:批量执行 vs 最大并发数,实用场景全解析!
前端·javascript
Web小助手14 分钟前
大保剑:Promise的有趣体验
javascript
李大玄14 分钟前
Google浏览器拓展工具 "GU"->google Utils
前端·javascript·github
爱编程的喵15 分钟前
从DOM0到事件委托:揭秘JavaScript事件机制的性能密码
前端·javascript·dom
蓝倾20 分钟前
京东批量获取商品SKU操作指南
前端·后端·api
JSLove27 分钟前
常见 npm 报错问题
前端·npm