我们在ionic环境配置完成后,创建了一个测试demo,这里我们在这个demo的基础上进行开发。 首先查看本机ip,比如我的ip是192.168.1.101,那么就使用下面的命令开启服务器 ~~~ ionic serve --address 192.168.1.101 ~~~ 我们这里加上本机ip的目的,是让同在一个局域网环境下的手机可以访问,以便真机调试。打开微信扫描一下该地址,就可以直接在微信里面打开这个网页。ionic会监测www文件夹的文件是否发生变化, 从而实时用websocket通知浏览器进行刷新, 不需要我们手动刷新,这时我们如果修改了代码,微信里面的页面会自动刷新,这使得开发非常方便。 www是项目的开发目录,页面、样式、脚本和图片都放在这个目录下 css/style.css 你自己的样式文件写到这里 js/app.js 这个文件里面主要是一些公共的配置,路由等 js/controllers.js 这个文件是控制器 js/services.js 在这个文件里写针对接口的服务类 templates/ 这个目录里的都是模板 index.html 这个是入口文件 ~~~ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> <title></title> <link rel="manifest" href="manifest.json"> <!-- un-comment this code to enable service worker <script> if ('serviceWorker' in navigator) { navigator.serviceWorker.register('service-worker.js') .then(() => console.log('service worker installed')) .catch(err => console.log('Error', err)); } </script>--> <link href="lib/ionic/css/ionic.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above <link href="css/ionic.app.css" rel="stylesheet"> --> <!-- ionic/angularjs js --> <script src="lib/ionic/js/ionic.bundle.min.js"></script> <!-- cordova script (this will be a 404 during development) --> <!-- <script src="cordova.js"></script> --> <!-- your app's js --> <script src="js/app.js"></script> <script src="js/controllers.js"></script> <script src="js/services.js"></script> </head> <body ng-app="starter"> <!-- The nav bar that will be updated as we navigate between views. --> <!-- <ion-nav-bar class="bar-stable"> <ion-nav-back-button> </ion-nav-back-button> </ion-nav-bar> --> <!-- The views will be rendered in the <ion-nav-view> directive below Templates are in the /templates folder (but you could also have templates inline in this html file if you'd like). --> <ion-nav-view></ion-nav-view> </body> </html> ~~~