外观
下载安装方式配置
约 475 字大约 2 分钟
2025-10-31
关于SCSS
uView Next依赖SCSS,您必须要安装此插件,否则无法正常运行。
- 如果您的项目是由
HBuilder X创建的,相信已经安装scss插件,如果没有,请在HX菜单的 工具->插件安装中找到"scss/sass编译"插件进行安装, 如不生效,重启HX即可 - 如果您的项目是由
vue-cli创建的,请通过以下命令安装对sass(scss)的支持,如果已安装,请略过。
// 安装sass
npm i sass -D
// 安装sass-loader
npm i sass-loader -D准备工作
在进行配置之前,请确保您已经根据安装中的步骤对uView Next进行了下载安装,如果没有,请先下载安装。
配置步骤 (3步)
main.js uni.scss App.vue 3个文件中都要进行配置
1. 引入uView Next主JS库,注意vue2和vue3的用法不同
在项目根目录中的main.js中,引入并使用uView的JS库,注意这两行要放在import Vue之后。
2. 在引入uView Next的全局SCSS主题文件
在项目根目录的 uni.scss 中第一行的位置引入此文件。
@import '@/uni_modules/uview-next/theme.scss';3. 引入uView基础样式
在App.vue中第一行的位置引入,注意给style标签加入lang="scss"属性
<style lang="scss">
@import "@/uni_modules/uview-next/index.scss";
</style>