欢迎您光临深圳塔灯网络科技有限公司！
余先生：13699882642
余先生：13699882642
余先生：13699882642
发表日期：2017-02 文章编辑：小灯 浏览次数：1218
APICloud混合APP开发入门指引
企业建站知识
推广知识
小程序
微信营销
APP开发
APICloud Snippets插件npm install -g apicloud-cli ~/app/ 或 D:\app\\，在终端运行以下命令（不要输入#及其后面的内容）：apicloud help #看看都有啥命令 apicloud init --template default --name jianshu #创建一个apicloud项目，jianshu是项目和文件夹名 cd jianshu #进入jianshu文件夹 yarn add jquery vue bootstrap@4.0.0-alpha.6 fastclick font-awesome #安装所需的包 echo "**/node_modules/**" > .syncignore #向手机同步文件时忽略这些文件 cp `find node_modules -name "*.min.js"` script #复制所有的*.min.js到script文件夹 cp `find node_modules -name "*.min.css"` css #复制所有的*.min.css到css文件夹 cp -r node_modules/font-awesome/fonts . #复制Font Awesome的字体文件夹到当前目录 echo >index.html #清空index.html echo > html/main.html #清空html/main.html subl . #用sublime打开当前项目 index.html编辑，贴入以下代码：<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小 </title> <meta name="viewport" content="user-scalable=0,width=device-width,initial-scale=1.0"/> <meta name="format-detection" content="telephone=no,email=no,date=no,address=no"> <link rel="stylesheet" href="./css/bootstrap.min.css"> <link rel="stylesheet" href="./css/font-awesome.min.css"> </head> <body> <div id="app"> <nav id="header" class="text-center fixed-top pb-0"> <h5>小 </h5> </nav><nav id="footer" class="text-center fixed-bottom text-muted"> <div class="d-flex pl-3 pr-3 pt-2 justify-content-between"> <div class="text-success"><i class="fa fa-users"></i><br>关注</div> <div><i class="fa fa-safari"></i><br>发现</div> <div><i class="fa fa-plus"></i><br>写文章</div> <div><i class="fa fa-bell-o"></i><br>消息</div> <div><i class="fa fa-user-o"></i><br>我的</div> </div> </nav> </div> <script src="./script/api.js"></script> <script src="./script/jquery.min.js"></script> <script> apiready = function () { $api.fixStatusBar($api.byId('header')); api.setStatusBarStyle({ style: 'dark' }); api.openFrame({ name: 'main', url: './html/main.html', rect: { x: 0, y: $('#header').outerHeight(), w: 'auto', h: screen.height - $('#header').outerHeight() - $('#footer').outerHeight() }, bounces: true }); } </script> </body> </html> ./html/main.html中贴入以下代码：<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小 </title> <meta name="viewport" content="user-scalable=0,width=device-width,initial-scale=1.0"/> <meta name="format-detection" content="telephone=no,email=no,date=no,address=no"> <link rel="stylesheet" href="../css/bootstrap.min.css"> <link rel="stylesheet" href="../css/font-awesome.min.css"> </head> <body> <div> <div class="container pt-3"> <p>什么都没有</p> </div> </div> </body> </html> apicloud wifiStart开启wifi同步服务器，注意显示的ip和端口，不要关闭本窗口。192.168.1.x和 8686（确保手机和电脑在同一网段，连接后圆球为浅绿色）。~/app/jianshu，输入apicloud wifiSync 同步代码到手机，手机应该会显示同步过程并自动运行App。
Paste_Image.png 