基于 Electron 电脑版小程序平台 开发多个小程序 COOL-AI
lpap123456 · 2020-08-11 16:21:27 +08:00 · 3034 次点击这是一个创建于 1563 天前的主题，其中的信息可能已经有所发展或是发生改变。
基于 Electron 电脑版小程序平台 开发多个小程序
背景
目前小程序在移动端热火朝天，微信、百度、支付宝、抖音、头条等等都有自己的小程序平台。但是 pc 端的却比较少人重视，虽然有一些 pc 端的软件如 360 等有相似的平台，但仅仅局限于安全的领域。
COOL-AI
COOL-AI 是基于 Electron 开发的跨平台(Mac 、Window)的多应用平台，开发者可以在上面不断地开发自己的应用。如：企业为了提高工作效率往往需要开发各种不同的特殊的小工具，也可以做一些行业类的应用，如：仓库管理，房产信息管理，由于 Electron 的特性是可以把硬件结合到开发中来。
特性
- 丰富的底层 API： 除了 electron 、node 等 api，cool 官方还提供如：云数据库、即时通信、云推送、本地数据库等 pc 端应用常用的 api 。
- 简洁的界面：页面简洁大方，易操作，提供开发者平台，让开发者发布和开发插件更加简单便捷。
- 提供应用开发脚手架：像保姆般地呵护开发者，让开发者快速上手应用开发。
- 调皮的小酷： 你想让小酷做什么呢？
基于此你开发应用的时候几乎不需要部署自己的服务器，如你开发一个社区交流的应用可以用云数据库；开发聊天的应用可以用到云数据库+即时通信。
## 文档地址
## 前提条件
为了更快地安装项目依赖，必须提前安装好cnpm
!>npm install -g cnpm --registry=https://registry.npm.taobao.org
## 创建应用
##### 1 、使用 COOL-AI 脚手架创建
```js
1 、vue create project
2 、cd project
3 、vue add router //如果新建的时候已经选择这步可以忽略
4 、vue add vue-cli-plugin-cool-ai //添加 COOL-AI 的脚手架插件
5 、npm run serve
```
!> vue 的router是必须添加的，并且需要将 router 的mode设置为hash
#### 2 、目录结构
```js
project
├── package.json
├── app.json (COOL-AI 应用配置文件)
├── db.json (COOL-AI 数据库配置文件)
├── public
├── src
| ├── assets(资源)
│ ├── components(组件)
│ ├── router(路由)
│ ├── views(页面)
| |—— App.vue
| |—— main.js
| |—— preload.js(cool-ai 预加载的 js)
```
##### 3 、app.json 配置
```js
{
// 应用 ID，用脚手架创建的时候自动生成
"appId": "z-gK4vSCQ",
// 应用名称
"name": "这是个测试应用",
// 版本号
"version": "0.0.1",
// 应用描述
"description": "测试应用",
// 入口文件默认为 index.html 一般不需要修改
"main": "index.html",
// 预加载 js， 该 js 文件会在所有资源文件之前加载
"preload": "preload.js",
// 应用 logo， 一般无需修改
"logo": "logo.png",
// 应用支持的平台
"platform": [ "win32", "darwin" ],
// 关键字
"keyWords": [ "cool-ai", "cool" ],
// 打开时时候隐藏小酷，如果隐藏了应用显示区域会更大
"xiaoku": { "hide": false },
// 开发时的配置
"dev": {
// 地址
"main": "http://127.0.0.1:8081",
// 预加载 js
"preload": "src/preload.js",
// logo
"logo": "src/assets/logo.png"
},
// preload.js 引用第三方包时需要在此添加
"build": { "externals": [] }
}
```
##### 4 、db.json 配置文件
```js
{
// 是否是云端数据库，false 为本地数据库
"isCloud": false,
// 表结构
"tables": [{
"name": "user",
"model": {
"id:int": {
"pk": true,
"ai": true
},
"age:int": {
"default": 13,
"max": 110,
"min": 13
},
"name:string": {
"default": "none",
"notNull": true
}
}
}]
}
```
表结构详见nanosql
## 调试应用
##### 1 、打开开发者中心
打开或运行 COOL-AI->微信扫码登录->点击头像进入开发者中心
##### 2 、在开发者中心创建应用
将之前创建好的项目中的app.json文件拖入开发者中心，就会自动创建一个对应的项目
#### 3 、运行应用
点击运行按钮，就可以看到对应应用的运行窗口啦
#### 4 、上传应用
点击上传按钮，填写版本信息，点确定后应用会自动打包编译并上传
 |
1
xiadd 2020-08-11 16:26:07 +08:00
话说我记得微信 pc 端有小程序吧，不过没有入口
|
 |
2
chucongqing 2020-08-11 16:37:28 +08:00
@xiadd 在电脑板微信左下角第一个图标是小程序的入口
|
 |
3
smallfish1990 2020-08-11 17:34:42 +08:00
有没有技术方案科普的文章或者类似开源的产品，公司想用
|
Select Language