티스토리 뷰

728x90
반응형


gulp-ng-constant - https://github.com/guzart/gulp-ng-constant


- Angular 상수 모듈의 동적 생성을 위한 플러그인.


아래는 내가 했던 코드 내용이다.


환경은 yeoman의 angular-fullstack@3.8.0 을 이용했다. 

- 참고로 angular-fullstack 3.8버전에서는 ES6 를 사용하게 해주고 babel 로 트랜스파일 해준다. 



gulpfile.babel.js

import gulpLoadPlugins from 'gulp-load-plugins';

var plugins = gulpLoadPlugins();//설치한 gulp의 플러그인들을 로드할 필요없이 스태틱 메서드 형태로 쓸수 있게 해준다.

// 플러그인 명이 ng-constant와 같은 것은 ngConstant 처럼 (-)대시를 빼고 캐멀케이스방식으로 호출해주면 된다.


const clientPath = require('./bower.json').appPath || 'client';

const serverPath = 'server';



gulp.task('clean:constant'() => del([`${clientPath}/app/app.constant.js`]{force: true}));


gulp.task('constant:alpha', ['clean:constant'], function() {

let alphaAPI = require(`./${serverPath}/config/environment/alpha`);
return plugins.ngConstant({
name: 'myApp.constants', //angular에 지정할 모듈명
deps: [], //angular.module() 에 있어야하는 의존성을 주입하는 배열입니다.

// 결과 -->angular.module("myApp.constants", [])
wrap: true, //자동 줄바꿈을 활성 혹은 비활성
stream: true, // true이면 gulp.pipe() 를 사용할 수 있게함
constants: { EndPoint: alphaAPI }
})
.pipe(plugins.rename({
basename: 'app.constant' // app.constant.js 라는 이름으로 파일 생성.
}))
.pipe(gulp.dest(`${clientPath}/app/`))
});

app.constant.js (gulpfile.babel.js 에서 빌드할때 자동으로 생성해준 파일 )

(function(angular, undefined) {
angular.module("myApp.constants", [])
.constant("EndPoint", {
"server": {
"apiUrl": "http://어쩌구저쩌구서버주소.com"
}
});
})(angular);



alpha.js ( server/config/environment/alpha.js 

'use strict';

// Development specific configuration
// ==================================
module.exports = {
server:{
apiUrl:'http://어쩌구저쩌구서버주소.com'
},
// 시작시 샘플데이터를 채워야 하는지 여부~
seedDB: true
};


728x90
반응형

'Programming language > Angularjs(1.x)' 카테고리의 다른 글

ng-file-upload 파일 업로드~  (0) 2017.07.12
Angular style guide  (0) 2017.06.26
JWT ( json web token ) 참고 예제  (0) 2017.06.22
angular 의 서비스  (0) 2017.05.22
yeoman angular-fullstack 명령어  (0) 2017.03.10
댓글