Git Product home page Git Product logo

angularjs-gulp-example's Introduction

Angular Gulp baseline build

This repository contains a baseline Gulp build for AngularJs development, applied to a sample test app.

The build is as simple as possible (less than 100 lines excluding comments), but still includes all the features that an AngularJs project will most likelly need:

  • integration with bower - to ensure all the latest dependencies are present
  • Sass (with source maps) - for building more maintainable stylesheets. The plugin used uses libsass and does not introduce a dependency in the Ruby tool chain
  • unit testing / integration testing with Karma, Jasmine and PhantomJs
  • cache busting - to prevent cache problems in all environments, dev tools opened or closed, etc.
  • template cache pre-population - to prevent that each template causes one extra HTTP request
  • jshint - the de-facto Javascript code quality checker
  • concatenation
  • browserify integration - for using the CommonJs require('module') synchronous import syntax and avoid maintaining config files with dependencies
  • Javascript source maps
  • Angular-friendly Javascript minification
  • sprite generation
  • a development web server with live reload, that re-loads the initial page of the project

A blog post concerning this build is available here

Installation instructions

First make sure Gulp is globally installed, by running:

npm install -g gulp

After cloning the project, run the following commands:

npm install
gulp
gulp dev

This will start the development server, the TODO sample app should be available at the following url:

http://localhost:8000/dist/index.html

angularjs-gulp-example's People

Contributors

jhades avatar sebeichholz avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

angularjs-gulp-example's Issues

Warnings when run with node 0.12.0

FYI. Ran into warnings during npm install. It might be just a version thing with karma, and pngjs. That seems pretty easy.

I'm not sure about node-gyp that is calling customFds vs. stdio.

npm WARN engine [email protected]: wanted: {"node":"~0.8 || ~0.10"} (current: {"node":"0.12.0","npm":"2.5.1"})
npm WARN engine [email protected]: wanted: {"node":"0.8.x"} (current: {"node":"0.12.0","npm":"2.5.1"})

> [email protected] install /Users/bbonner/Documents/indigo/angularjs-gulp-todo/node_modules/karma/node_modules/chokidar/node_modules/fsevents
> node-gyp rebuild

child_process: customFds option is deprecated, use stdio instead.
  SOLINK_MODULE(target) Release/.node
  SOLINK_MODULE(target) Release/.node: Finished
  CXX(target) Release/obj.target/fse/fsevents.o
  SOLINK_MODULE(target) Release/fse.node
  SOLINK_MODULE(target) Release/fse.node: Finished

> [email protected] install /Users/bbonner/Documents/indigo/angularjs-gulp-todo/node_modules/karma-phantomjs-launcher/node_modules/phantomjs
> node install.js

Downloading https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-1.9.8-macosx.zip
Saving to /var/folders/36/l9drm8hd3gvcbvlblxyt54dr0000gn/T/phantomjs/phantomjs-1.9.8-macosx.zip
Receiving...
  [=======================================-] 98% 0.0s
Received 9187K total.
Extracting zip contents

extra steps under osx

I don't know enough about the build chain to fix myself (if I have time I'll figure it out).
npm install -g gulp
npm install gulp-sass
npm install node-sass

Otherwise you get:
Gulp not found
And then
throw new Error('libsass bindings not found. Try reinstalling node-sass?');

followed the instructions in read me file but got error

followed the instructions in read me file but got error on running "gulp"

.../work/samples/angular1_seed/angularjs-gulp-example/node_modules/socket.io/lib/store.js:35
Store.prototype.proto = EventEmitter.prototype;
^

TypeError: Cannot read property 'prototype' of undefined
at Object. (/Users/saurabh/work/samples/angular1_seed/angularjs-gulp-example/node_modules/socket.io/lib/store.js:35:41)
at Module._compile (module.js:571:32)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.