小程序通过npm包使用WeUI WXSS
2019-03-29 本文已影响0人
lemon031
1.小程序的初始目录
图12.使用npm 包
2.1官网补充
首先要npm init创建package.json文件,然后按照官网步骤操作就可以了。
图2.12.2创建package.json文件介绍
命令行里会以交互的形式让你填一些项目的介绍信息,依次介绍如下:(不知道怎么填的直接回车、回车...)
name 项目名称
version 项目的版本号
description 项目的描述信息
entry point 项目的入口文件
test command 项目启动时脚本命令
git repository 如果你有 Git 地址,可以将这个项目放到你的 Git 仓库里
keywords 关键词
author 作者叫啥
license 项目要发行的时候需要的证书,平时玩玩忽略它
图2.23.npm安装WeUI WXSS包步骤
3.1安装依赖包
GitHub地址:https://github.com/Tencent/weui-wxss
npm下载:npm i weui-wxss
npm i weui-wxss安装依赖包后会生成node_modules文件
图3.13.2以下就是按照微信官网的操作步骤
图3.21.操作上面这一步的时候,我这边提示未找到app.wxss.js(如下图3.3)
2.去对应的路径下创建对应的文件后,再次操作上面这一步就会出现如图3.4
3.构建完成目录下面会生成一个miniprogram_npm文件(如图3.5)
4.然后完成图3.6操作(在详情里)
图3.3 图3.4 图3.5 图3.64使用WeUI WXSS
1.依赖包下的目录如图4.1,小程序只会用到dist文件
2.按照如图4.2引入样式文件,我用了scss编辑器
3.最终效果如图4.3,dist下面的example文件里都是例子可以参考!
图4.1 图4.2 图4.3以上是本人操作流程,希望可以帮助到大家,如有问题请指出,会虚心接受!