nxui

0.3.0 • Public • Published

NXUI

快速开始

  1. 安装: npm install --save-dev nxui

  2. 初始化: node_modules/nxui/nxui init 按照提示生成用户库目录

  3. 开始对生成的文件进行编辑

    • 在生成的目录 modulepage 文件夹下进行编译
    • module文件夹 建议书写自定义的高度复用的模块scss,如 header.scss footer.scss
    • page文件夹 建议书写自定义页面的scss,如 index.scss welcome.scss 等(当然,聪明的你一定会在这里@import刚刚写好的header.scssfooter.scss)
  4. 使用gulpgulp-sass对写好的 scss 文件进行编译

    • 如何使用gulp编译scss文件:
    var gulp = require('gulp')
    var gulpSass = require('gulp-sass')
     
    gulp.task('sass',function () {
        gulp.src('./user/page/index.scss')
            .pipe(gulpSass({outputStyle:"expanded"}))
            .pipe(gulp.dest(''));
    })

    然后,运行 gulp sass 即可在项目根目录得到 index.css 文件,如有需要,可以配合 gulp-rename对文件进行重命名,或使用 gulp watch.更多 gulp 的使用方法,请参考官网 gulpjs.com

  5. 运行 node_modules/nxui/nxui demo,然后打开浏览器,访问 http://localhost:2333 即可看到 demo

简介

NXUI 是一套同内信原生视觉体验一致的基础样式库,由内信官方设计团队为内信内嵌网页开发量身打造,可以令用户的使用感知更加统一。在内信网页开发中使用 NXUI,有如下优势:

  • 同内信客户端一致的视觉效果,令所有内信用户都能更容易地使用你的网站
  • 便捷获取快速使用,降低开发和设计成本
  • 内信设计团队精心打造,清晰明确,简洁大方
  • 该样式库目前包含 button、cell、dialog、progress、toast、article、icon 等各式元素。

详细的使用文档可以访问此处: 内信.

  • 文档更新存在严重滞后的问题,以demo中代码为准.如果遇到问题,可以邮件联系我.

Readme

Keywords

Package Sidebar

Install

npm i nxui

Weekly Downloads

2

Version

0.3.0

License

MIT

Last publish

Collaborators

  • yklykl123
  • geeknull
  • murmur