Skip to content

Instantly share code, notes, and snippets.

@cognitom
Last active August 29, 2015 14:12
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save cognitom/757a3fe6b13036aa7e99 to your computer and use it in GitHub Desktop.
AngularとBrowserifyの微妙すぎる関係 ref: http://qiita.com/cognitom/items/1f5d82a4513af446cb57
<script src="bower_components/todomvc-common/base.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers/todoCtrl.js"></script>
<script src="js/services/todoStorage.js"></script>
<script src="js/directives/todoFocus.js"></script>
<script src="js/directives/todoEscape.js"></script>
<script src="app.js"></script>
# src/app.coffee
angular
.module 'app', []
.controller 'todoCtrl', require './controller/todoCtrl'
.factory 'todoStorage', require './service/todoStorage'
# src/controller/todoCtrl.coffee
module.exports = [
'$scope', 'todoStorage'
($scope, todoStorage) ->
$scope.todos = todoStorage.get()
# 処理が続く
]
# src/service/todoStorage.coffee
STORAGE_ID = 'todos-angularjs-perf'
module.exports = ->
get: -> JSON.parse localStorage.getItem STORAGE_ID
put: (todos) -> localStorage.setItem STORAGE_ID, JSON.stringify todos
gulp = require 'gulp'
browserify = require 'browserify'
coffeeify = require 'coffeeify'
source = require 'vinyl-source-stream'
streamify = require 'gulp-streamify'
uglify = require 'gulp-uglify'
gulp.task 'angular', ->
browserify
entries: ['src/app.coffee']
extensions: ['.coffee']
.transform coffeeify # CoffeeScriptのコンパイル
.bundle()
.pipe source 'app.js'
.pipe streamify uglify mangle: false # ミニファイ (mangleなし)
.pipe gulp.dest 'dist/'
# src/app.coffee
angular
.module 'app', []
.controller 'todoCtrl', require './controller/todoCtrl'
# src/controller/todoCtrl.coffee
todoStorage = require '../service/todoStorage'
module.exports = [
'$scope'
($scope) ->
$scope.todos = todoStorage.get()
# 処理が続く
]
# src/service/todoStorage.coffee
STORAGE_ID = 'todos-angularjs-perf'
module.exports =
get: -> JSON.parse localStorage.getItem STORAGE_ID
put: (todos) -> localStorage.setItem STORAGE_ID, JSON.stringify todos
# ./app.coffee
app = angular.module 'app', []
# ./controller/todoCtrl.coffee
app.controller 'todoCtrl', ($scope, todoStorage) ->
$scope.todos = todoStorage.get()
# 処理が続く
# src/service/todoStorage.coffee
app.factory 'todoStorage', ->
STORAGE_ID = 'todos-angularjs-perf'
ret =
get: -> JSON.parse localStorage.getItem STORAGE_ID
put: (todos) -> localStorage.setItem STORAGE_ID, JSON.stringify todos
# gulpfile.coffee
gulp = require 'gulp'
coffee = require 'gulp-coffee'
concat = require 'gulp-concat'
uglify = require 'gulp-uglify'
annotate = require 'gulp-ng-annotate'
gulp.task 'angular', ->
gulp.src [
'src/app.coffee'
'src/*/*.coffee'
]
.pipe coffee bare: true # CoffeeScriptのコンパイル
.pipe concat 'app.js' # 結合
.pipe annotate() # アノテーションをつけて`uglify`に備える
.pipe uglify() # ミニファイ
.pipe gulp.dest 'dist/'
# src/app.coffee
angular.module 'app', []
require './controller/todoCtrl'
require './service/todoStorage'
# src/controller/todoCtrl.coffee
app = angular.module 'app'
app.controller 'todoCtrl', ($scope, todoStorage) ->
$scope.todos = todoStorage.get()
# 処理が続く
# src/service/todoStorage.coffee
app = angular.module 'app'
STORAGE_ID = 'todos-angularjs-perf'
app.factory 'todoStorage', ->
get: -> JSON.parse localStorage.getItem STORAGE_ID
put: (todos) -> localStorage.setItem STORAGE_ID, JSON.stringify todos
gulp = require 'gulp'
browserify = require 'browserify'
coffeeify = require 'coffeeify'
annotatify = require 'browserify-ngannotate'
source = require 'vinyl-source-stream'
streamify = require 'gulp-streamify'
uglify = require 'gulp-uglify'
gulp.task 'angular', ->
browserify
entries: ['src/app.coffee']
extensions: ['.coffee']
.transform coffeeify # CoffeeScriptのコンパイル
.transform annotatify # アノテーションをつけて`uglify`に備える
.bundle()
.pipe source 'app.js'
.pipe streamify uglify() # ミニファイ
.pipe gulp.dest 'dist/'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment