baida v0.8.6
百搭——组件模板一体化构建工具,一键集成
当前为 beta 版本,正在不断迭代中,尽请期待正式版,喜欢请分享给你的朋友吧。
在线体验地址:http://easybui.com/baida
切换预览快捷键: Alt+b 刷新快捷键:Alt+r; 在线版手动刷新才能看到修改; 本地版实时刷新预览;
简介
百搭是一个基于BUI制作的H5 在线开发工具,可本地开发或,独立部署。项目可一键集成组件,模板,围绕BUI的生态资源(组件,模板,案例)整合,简化了开发构建流程,集中管理项目,统一开发环境,减少工程依赖安装等问题,有效提升开发效率。
特点
- 工程模板可预览构建,开箱即用
- 资源共享(模板,组件,案例),一键下载
- 统一开发环境,无需安装依赖
- 常用控件代码库,所见即所得
- 代码开发提示,减少参数记忆
- 工程,组件在线预览
- 组件化开发
- Monaco代码编辑(Vscode)
视频演示
视频演示
截图预览
一图看懂百搭
首页
新建项目
项目预览
组件
模板
安装使用
一键复制安装
建议优先使用这种方式尝试, node 环境 16.x
npx baida@latest start
国内使用 cnpm 安装速度更快。如果windows安装报错,也可以试试 cnpm 安装
Windows 安装
需要先使用右键,管理员打开终端,运行以下命令,
# 全局安装
npm install baida -g --force
# 服务
baida start
Mac 安装
mac 如果安装报错,需要提升NPM权限 sudo npm -g config set user root
,
# 提升npm安装权限
sudo npm -g config set user root
# 全局安装
sudo npm install baida -g
# 服务
sudo baida start
打开网址: http://localhost:9000
工程预览地址:http://localhost:9001/username/projectname/src/index.html
常见报错问题
报错排查,由于node环境不一样,安装过程可能存在报错,目前已知的报错有:
1. better-sqlite3 if noe defined npm_config_node_gyp
先全局安装 npm install node-gyp -g
- gyp ERR! find VS msvs_version not set from command line or npm config ... Error: Could not find any Visual Studio installation to use 需要先安装并配置
# 安装 python 和 vs studio 环境 默认2017
npm install --global windows-build-tools
# 配置
npm config set msvs_version 2017
无法运行,node Error: Could not locate the bindings file. Tried
检查第1步,第2步,问题可能还是在 better-sqlite3 无法正确编译
- Powershell 终端如果不能执行 baid start ,则需要修改策略, 或者使用Node的终端(右键管理员打开)
修改策略,再执行安装
set-ExecutionPolicy RemoteSigned
- 安装源为私有源,会导致一些依赖不能正确安装
# 查看安装源
npm config ls
# 如果不是 https://registry.npmjs.org ,重新设置
npm config set 'https://registry.npmjs.org'
或者使用 cnpm
安装
- 端口占用
按以下命令先终止掉端口,也可以使用新的端口,新端口之前的缓存都不存在。 baida start 8888
windows:
# 查找9000端口占用的pid名,如53645,只是示例,不同环境不一样的pid
netstat -aon|findstr 9000
# 结束掉pid:53645 进程
taskkill -f -pid 53645
mac:
# 查找9000端口占用的pid名,如53645,只是示例,不同环境不一样的pid
sudo lsof -i tcp:9000
# 结束掉pid:53645 进程
sudo kill -9 53645
- windows 10 没有权限
报
EPERM: operation not permitted, mkdir 'C:
这类的错误,部分windows10 在执行编译预览的时候会有这个问题,可以右键删除dist目录,再重新编译。
自定义环境变量说明
使用编辑器模式创建项目
cross-env NODE_ENV=editor USERNAME_ENV=easybui PROJECT_ENV=bui PLATFORM_ENV=webapp TEMPLATE_ENV=empty DEV_ENV=spa PORT_ENV=8000 WORKSPACE_ENV=/Users/yourname/Baida FROM_ENV=/Users/yourname/Baida/release/bui DB_ENV=baida-editor.db baida create
NODE_ENV 当前环境变量,有4个版本 production: 部署个人版,development:开发版,online: 多人在线版,不能实时更新, editor: 编辑器模式, 无需权限,一次编辑一个项目 USERNAME_ENV 用户名,自定义 PROJECT_ENV 项目名,自定义 PLATFORM_ENV 项目的平台版本 默认 webapp | link | bingotouch | cordova | weixinapp | dcloud | apicloud TEMPLATE_ENV 项目模板 默认 empty | tab-foot | tab-head | tab-side | main-sidebar | main-login | main-form | main-list DEV_ENV 项目的开发模式 默认 spa | mpa PORT_ENV 项目的自定义端口,默认 9000 编辑器模式 默认 8000 WORKSPACE_ENV 工作空间自定义目录,存放版本,数据库,用户,项目等资料信息 FROM_ENV 构建来源,从这个目录复制构建项目信息,如果为空,会从远程获取最新版本进行解压 DB_ENV 数据库名称,默认 baida.db
baida create 根据以上参数创建项目
使用反馈
鸣谢
- BUI
- jQuery
- jsTree
- Monco-Editor
- Node
- express
- better-sqlite3
- babel
- browserify
- browser-sync
- gulp ...
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago