uview的安装(npm安装方式)

uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架uView UI,是uni-app生态最优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水https://www.uviewui.com/

安装sass

// 安装node-sass
npm i node-sass -D

// 安装sass-loader,注意需要版本10,否则可能会导致vue与sass的兼容问题而报错
npm i sass-loader@10 -D

sass安装报错处理办法:

先卸载

npm uninstall node-sass

uview的安装(npm安装方式)_第1张图片

 对应的安装,我安装的是4.14

node -v
npm config set registry http://registry.npm.taobao.org/
npm install  [email protected]
npm i sass-loader@10 -D

 安装uview

// 安装
npm install uview-ui

main.js引用

// main.js
import uView from "uview-ui";
Vue.use(uView);

 app.vue引入到全局

配置easycom组件模式

uni-app为了调试性能的原因,修改easycom规则不会实时生效,配置完后,您需要重启HX或者重新编译项目才能正常使用uView的功能。

请确保您的pages.json中只有一个easycom字段,否则请自行合并多个引入规则。

// pages.json
{
	"easycom": {
		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},
	
	// 此为本身已有的内容
	"pages": [
		// ......
	]
}

 Cli模式额外配置(vue-cli模式的项目)

// vue.config.js,如没有此文件则手动创建
module.exports = {
    transpileDependencies: ['uview-ui']
}

运行时sacc报错的处理:

uview的安装(npm安装方式)_第2张图片

 解决方案:

uview的安装(npm安装方式)_第3张图片

@import "uview-ui/theme.scss";
@import "uview-ui/index.scss";

你可能感兴趣的:(vue.js,微信开放平台)