一、npm包的限制
1.不支持依赖于Node.js内置库的包
2.不支持依赖于浏览器内置对象的包
jq就不支持。
3.不支持依赖c++插件的包
一些加密的包。
二、Vant Weapp组件库
使用的MIT开源许可协议,对商业使用友好。
1.安装
首先需要创建package.json包管理文件。
然后下载插件,建议使用@1.3.3
npm i @vant/weapp@1.3.3 -S --production
2.构建npm包
点击工具,选中构建npm选项
然后点击详情,勾选使用npm模块。
这样就能使用npm模块了
因为小程序不是直接使用node_modules包的,而是使用的miniprogram_npm。每次下载一个包后,需要先删除miniprogram_npm包,然后重新构建npm,才能正常使用。
3.修改app.json
将 app.json 中的 “style”: “v2” 去除
这样就能使用vant插件了。
三、定义和使用CSS变量
1.定义变量
html{
--main-color :red
}
需要用两个减号
变量的使用也是有作用域的,
定义在html下,可以给所有的元素都使用
要是定义好一个id或class,只有这个元素及其子元素能使用了。
2.使用变量
div{
color:var(--main-color)
}
3.vant里使用css变量
在app.wxss文件中
/* 定义一个css变量节点
page节点表示每个小程序页面的根节点,相当于html
这样每个元素才都能使用css变量
*/
page{
/* 这个表示危险按钮的背景色变成其他颜色 */
--button-danger-background-color:#D60000;
}