viarotel / vue-apicloud-cli

基于vue的APICloud脚手架

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

vue-apicloud-cli

基于vuecli的多页面APICloud脚手架, ui库使用 vant(已配置全自动按需导入), css 框架使用 tailwindcss(下一代css框架), 请求使用axios的方式(添加了apicloud适配器支持, 完善了aes+rsa接口加密功能)

Contributors Forks Stargazers Issues MIT License


viarotel

vue-apicloud-cli

基于vue的多页面APICloud脚手架
探索本项目的文档 »

查看Demo · 报告Bug · 提出新特性

目录

上手指南

获取本项目
  1. clone 本项目 或 直接下载main包
git clone https://github.com/viarotel/vue-apicloud-cli.git
运行本项目
  1. 安装依赖
  2. 运行项目
npm install //or yarn
npm run serve //or yarn serve
wifi同步
  1. 打开调试端口
  2. 查看日志
  3. 输入同一局域网下的电脑ip地址和调试端口同步到手机
npm run wifi-start //or yarn wifi-start 打开调试端口
npm run wifi-log //or yarn wifi-log 打开日志
npm run wifi-sync //or yarn wifi-sync 同步到手机 需要重新打开一个窗口
通过vscode插件进行wifi同步
  1. vscode 中安装 APIClouid 拓展
  2. 在vscode设置中将APIClouid 拓展 的Subdirectories选项设置为 "/dist"
  3. 运行本项目 并打开当前项目中任意页面 鼠标右键 启动wifi服务 然后在手机loader应用中输入控制台显示的ip地址和端口号(注意必须在同一局域网下) 相当于 npm run wifi-start
  4. 鼠标右键 wifi增量同步即可同步 相当于 npm run wifi-sync
  5. 在输出中查看日志
打包构建
  1. 使用命令打包项目
  2. 将dist中的文件通过svn或手动压缩为widget.zip上传到APICloud的服务器中
  3. 通过apicloud控制台进行云打包

文件目录说明

filetree
├── /dist //打包生成的静态资源文件,用于生产部署。
├── /node_modules //存放npm命令下载的开发环境和生产环境的依赖包。
├── /public/ //存放在该文件夹的东西不会被打包影响,而是会原封不动的输出到dist文件夹中
│  ├── /js/ //由于是多页面应用所以采用外联的方式引入vue 
│  │  ├── vue.js   //开发模式使用
│  │  └── vue.min.js //正式环境使用
│  ├── /config.xml //apicloud的配置文件
│  ├── /template.html // 通过ejs渲染的模板文件
├── /src/
│  ├── /assets/ //存放项目中需要用到的资源文件,css、js、images等。
│  ├── /components/ //存放vue开发中一些公共组件
│  ├── /config/ //全局配置文件
│  ├── /icons/ //svg 图标文件
│  ├── /pages/ //存在vue页面组件的文件夹。
│  ├── /plugins/ //项目用到的插件集合
│  ├── /request/ //接口配置
│  ├── /utils/ //存放vue开发过程中一些公共的js方法。
├── .gitignore //git忽略文件配置
├── babel.config.js //对js文件进行编译转换增强的配置文件
├── jsconfig.json /JavaScript语言服务的配置文件 代码提示 文件索引提示等
├── LICENSE //开源许可说明
├── package.json  //包管理配置文件
├── postcss.config.js //对css文件进行编译转换增强的配置文件
├── README.md
├── tailwind.config.js //tailwindcss的配置文件
├── vue.config.js //vuecli配置文件
└── yarn.lock //yarn锁定依赖版本 防止环境不一致导致项目无法运行的问题

使用到的框架

关键字

  • vue
  • apicloud
  • vant
  • tailwindcss
  • axios

常见问题

  • 无法同步到设备 需要更改 public/config.xml文件中的widget.id 为对应的apicloud loader所对应的id 如果使用官方Loader可忽略

版本控制

该项目使用Git进行版本管理。

作者

viarotel@qq.com

qq:523469508 wx: luyao-ing

您也可以在贡献者名单中参看所有参与该项目的开发者。

版权说明

该项目签署了MIT 授权许可,详情请参阅 LICENSE

鸣谢

About

基于vue的APICloud脚手架

License:MIT License


Languages

Language:JavaScript 96.6%Language:Vue 2.6%Language:CSS 0.6%Language:HTML 0.2%