在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称(OpenSource Name):reflexdemon/slush-angular-gulp开源软件地址(OpenSource Url):https://github.com/reflexdemon/slush-angular-gulp开源编程语言(OpenSource Language):JavaScript 97.3%开源软件介绍(OpenSource Introduction):#slush-angular-gulp##Badges
IntroductionAll, would like to tell you slush-angular-gulp is build with inspiration from the below projects. Moreover, this is just a first step towards integration of all the goodies of the above mentioned projects and expect more on future releases. InstallationInstall slush-angular-gulp globally: npm install -g slush-angular-gulp You'll also need to have npm install -g bower gulp slush Bower dependencyHere is the list of dependencies that are pre selected.
CSS Preprocessor
Note All Project structureYou will also have the option to generate a simple Todo list app in your project as well, to be used as a live example of how to structure your app. The project structure with the Todo list example included will look like this:
Link to Gulpfile GeneratorsAvailable generators:
AppSets up a new AngularJS app, generating all the boilerplate you need to get started. The app generator also optionally installs Bootstrap and additional AngularJS modules, such as angular-resource (installed by default). Create a new folder for your project: mkdir my-angular-app Run the generator from within the new folder: cd my-angular-app
slush angular-gulp or cd my-angular-app
slush angular-gulp:app You will now be prompted to give your new AngularJS app a name, which will be dasherized and used in its ControllerGenerates a controller in Syntax: slush angular-gulp:controller <ctrl-Name> Example: slush angular-gulp:controller login
Produces (function() {
'use strict';
angular
.module('myAngularApp.user')
.controller('LoginCtrl', LoginCtrl);
//////////////////////
/**
* @ngdoc function
* @name myAngularApp.user.controller:LoginCtrl
* @description
* # LoginCtrl
* Controller of the myAngularApp.user
* @ngInject
*/
function LoginCtrl() {
this.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}
})(); and
Produce 'use strict';
/**
* Simple test class for LoginCtrl on myAngularApp.user
*/
describe('Controller: LoginCtrl', function () {
// load the controller's module
beforeEach(module('myAngularApp.user'));
var LoginCtrl;
// Initialize the controller and a mock scope
beforeEach(inject(function ($controller, $rootScope) {
LoginCtrl = $controller('LoginCtrl', {
// place here mocked dependencies
});
}));
it('should attach a list of awesomeThings to the scope', function () {
expect(LoginCtrl.awesomeThings.length).toBe(3);
});
});
ModuleGenerates a module in Syntax: slush angular-gulp:module <module-Name> Example: slush angular-gulp:module user
Produces /**
* Creates and initilizes the module user
*/
(function() {
'use strict';
angular.module('myAngular.user', [], moduleConfiguration);
/* @ngInject */
function moduleConfiguration() {
//TODO Have any module specific configurator here
});
}
})(); or if configs were separated out
Produces
DirectiveGenerates a directive in Syntax: slush angular-gulp:directive <directive-Name> Example: slush angular-gulp:directive awesome-thing
Produces /**
* @desc Please provide useful information regarding the directive with a proper example
* @example <div awesome-thing></div>
*/
(function() {
angular
.module('myAngularApp.user')
.directive('awesomeThing', awesomeThing );
function awesomeThing () {
/* implementation details */
}
})();
FilterGenerates a filter in Syntax: slush angular-gulp:filter <filter-Name> Example: slush angular-gulp:filter checkmark
Produces (function() {
'use strict';
angular
.module('myAngularApp.user').filter('checkmark', checkmarkFilter);
////////////////////
function checkmark() {
return function (input) {
return input ? '\u2713' : '\u2718';
};
}
})(); and Produces 'use strict';
describe('filter', function() {
beforeEach(module('myAngularApp.user'));
describe('checkmark', function() {
it('should convert boolean values to unicode checkmark or cross',
inject(function(checkmarkFilter) {
expect(checkmarkFilter(true)).toBe('\u2713');
expect(checkmarkFilter(false)).toBe('\u2718');
}));
});
});
RouteGenerates a route in Syntax: slush angular-gulp:route <route-Name> Example: slush angular-gulp:route user
Produces (function() {
'use strict';
angular
.module('myAngularApp.user')
.config( userRoute);
/* @ngInject */
function userRoute($routeProvider) {
$routeProvider
.when('/user', { //Default
controller: 'UserCtrl',
templateUrl: 'user/user.html'
});
}
})(); ServiceGenerates a service in Syntax: slush angular-gulp:service <service-Name> Example: slush angular-gulp:service session
Produces (function() {
'use strict';
angular
.module('myAngularApp.user')
.service('sessionService', sessionService);
/* @ngInject */
function sessionService() {
var someValue = '';
var service = {
save: save,
someValue: someValue,
validate: validate
};
return service;
////////////
function save() {
/* */
}
function validate() {
/* */
}
}
})(); FactoryGenerates a factory in Syntax: slush angular-gulp:factory <factory-Name> Example: slush angular-gulp:factory session
Produces (function() {
'use strict';
angular
.module('myAngularApp.user')
.factory('sessionFactory', sessionFactory);
/* @ngInject */
function sessionFactory() {
var someValue = '';
var factory = {
save: save,
someValue: someValue,
validate: validate
};
return factory;
////////////
function save() {
/* */
};
function validate() {
/* */
};
}
})();
ProviderGenerates a provider in Syntax: slush angular-gulp:provider <provider-Name> Example: slush angular-gulp:provider game
Produces (function() {
'use strict';
angular
.module('myAngular.user')
.provider('game', gameProvider);
/* @ngInject */
function gameProvider() {
var someValue = '';
var provider = {
save: save,
someValue: someValue,
validate: validate
};
return provider;
////////////
function save() {
/* */
}
function validate() {
/* */
}
}
})(); ConstantGenerates a constant in Syntax: slush angular-gulp:constant <constant-Name> Example: slush angular-gulp:constant apiKey 全部评论
专题导读
上一篇:lightingbeetle/generator-gulp-ink-email: Yeoman generator for creating responsiv ...发布时间:2022-06-21下一篇:sgreer81/bb-theme-child: Beaver Builder Child theme with Gulp发布时间:2022-06-21热门推荐
热门话题
阅读排行榜
|
请发表评论