ionic新建工程
Posted Zella
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ionic新建工程相关的知识，希望对你有一定的参考价值。
1、添加css,img,js,lib,templates文件夹
2、添加manifest.json和service-worker.js
3、添加index.html文件
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>Test</title> 6 <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 7 8 <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 9 <link href="lib/angular-material.css" rel="stylesheet"> 10 <link href="lib/jquery-ui.min.css" rel="stylesheet"> 11 12 <link rel="manifest" href="manifest.json"> 13 14 <script src="lib/ionic/js/ionic.bundle.js"></script> 15 <script src="lib/jquery-1.12.3.min.js"></script> 16 <script src="lib/jquery.md5.js"></script> 17 <script src="lib/jquery-ui.min.js"></script> 18 <script src="js/app.js"></script> 19 <script src="js/controllers.js"></script> 20 21 <script src="lib/angular-aria.js"></script> 22 <script src="lib/angular-material.min.js"></script> 23 </head> 24 <body ng-app="ysw" ng-controller="HomeCtrl" ng-cloak> 25 <ion-nav-view name="default"></ion-nav-view> 26 </body> 27 </html>
4、在js文件夹下新建app.js文件
angular.module(‘ysw‘, [‘ionic‘, ‘ysw.controllers‘]) .run(function ($ionicPlatform) { $ionicPlatform.ready(function () { if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) { cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); cordova.plugins.Keyboard.disableScroll(true); } if (window.StatusBar) { StatusBar.styleDefault(); } }); })/** * Created by Administrator on 2017/5/23. */ .config(function ($stateProvider, $urlRouterProvider, $ionicConfigProvider) { $ionicConfigProvider.views.transition("none"); $stateProvider .state(‘home‘, { url: ‘/home‘, cache: ‘false‘, views: { ‘default‘: { templateUrl: ‘templates/home.html‘, controller: ‘HomeCtrl‘ } } }) $urlRouterProvider.otherwise(‘/home‘); });
5、在js文件夹下新建controllers.js文件
angular.module(‘ysw.controllers‘,[])
.controller(‘HomeCtrl‘, function ($scope) {
try {
}catch(e){
console.error(e);
}
})
说明：
1、新建的HTML文件在templates文件夹下，并在app.js中写明，对应的controller添加在controllers.js文件中。
2、index.html中的<ion-nav-view name="default"></ion-nav-view>必须要添加。
3、app.js中的$urlRouterProvider.otherwise(‘/home‘);用于没有指明时默认显示的页面。
以上是关于ionic新建工程的主要内容，如果未能解决你的问题，请参考以下文章
ionic项目打包好Xcode工程，模拟器运行各种沙盒缓存目录