安装

开发环境

你可能只需要一个系统自带的编辑器,就可以使用BUI开发应用, 但通过以下软件相互配合,对开发效率会有一定的帮助.

  1. 编辑器 ( 推荐: vscode, Atom 或 Sublimetext3 );
  2. bui-fast 点击下载 (配合编辑器快速书写插件, 支持 Vscode(搜索安装bui-fast插件), Atom , Sublimetext , Webstorm , APICloudIDE ) 查看安装说明;
  3. buijs cli工程构建工具, 用于快速构建工程,模板,更新平台等功能

下载开发包

用过npm, 我们推荐您学习使用buijs自动化构建, 自动化构建默认是最新的bui版本. 并且 buijs -v1.6.0版本会自动根据你的node版本,创建对应的工程, 减少安装依赖的错误产生.

了解规范

部署运行

解压,进入工程目录, 通过这种运行, app.json可以配置域名代理,解决移动端调试的跨域问题. 生成的dist目录为最终要打包的目录, src目录保持源文件的方式.

第1种, 通过npm

  1. # 安装依赖
  2. $ npm install
  3. # 运行服务
  4. $ npm run dev

第2种, cnpm安装 (推荐)

  1. # 安装cnpm
  2. $ npm install -g cnpm --registry=https://registry.npm.taobao.org
  3. # 安装依赖
  4. $ cnpm install
  5. # 运行服务
  6. $ cnpm run dev

注意, 如果报错, 推荐安装cnpm, 使用 cnpm install 安装依赖. 另一个报错的原因是, node-sass 版本跟你的 node 版本不一致, 建议下载node 8.x. 如果你下载的 node 是10.15.3 LTS. node-sass 的版本要在 4.9+ , 需要先npm remove node-sass 再安装指定版本.

NodeJSMinimum node-sass version
Node 114.10+
Node 104.9+
Node 84.5.3+

第3种, 把src 目录放在 IIS 或者 phpstudy 之类的服务器, 运行就能直接观看效果, 单页工程打开空白需要解决浏览器跨域问题, Chrome跨域调试.

支持热更新

  1. npm run dev

跑起项目后, 保存代码就会自动刷新浏览器内容.

注意, 工程目录上不能有中文路径, 工程包里面也不能有中文命名.

编译sass或less

需要先安装 buijs, 1.6.x工程, 默认已经去掉对sass的支持, 需要自己选择创建.

  1. # 新增sass, 需要重新安装依赖
  2. buijs create -p sass
  3. # 新增less, 无需重新安装依赖
  4. buijs create -p less