2016-11-08 91 views
0

我在Angular中創建我的第一個SPA並使用SpringBoot Rest API。如何在Angular SPA中創建一個簡單的「構建」

我需要的是創建一個簡單的「構建」過程,就像Java項目的Maven一樣,所以我可以處理不同的環境常量。是否有可能使其變得簡單?我看過非常大的配置js,這是一個簡單的項目。

我有這個在我的app.js

angular.module('app', [ 'ui.router', 'ngCookies', 'ngMessages', 'ngStorage', 'ngAnimate', 'datatables', 
     'checklist-model', 'pascalprecht.translate', 'ui.bootstrap', 'oitozero.ngSweetAlert', 'ngSanitize', 
     'angucomplete-alt', 'localytics.directives', 'angular-peity']) 
      .constant('config', { 
       appName : 'MyApp', 
       appVersion : '1.0.0', 
       apiUrl : 'http://localhost:8080/rest/v1/', 
       auth : { 
        url : 'http://localhost:8080/oauth/token', 
        clientId : 'myAppOuath2', 
        header : 'Basic c29mdGFs123456F1dGgyOlh6NnFnamhwwxx=', 
        grantType : 'password' 
       } 
      }) 
... 

而且我想用這樣的通配符來使自動化網址:

... 
apiUrl : '{apiUrl}', 
auth : { 
    url : '{authUrl}', 
    clientId : '{clientId}', 
    header : '{authHeader}', 
    grantType : 'password' 
} 

謝謝!

+0

檢出grunt-preprocess:https://github.com/jsoverson/grunt-preprocess –

回答

0

我不熟悉maven。我一直使用Gulp或Grunt來構建我的SPA應用程序。

可以產生一些config.js(與咕嚕我用ngconstant插件):

ngconstant: { 
    options: { 
    name: 'config', 
    space: ' ', 
    dest: 'app/config.js' 
    }, 
    local: { 
    constants: { 
     ENV: 'local' 
    } 
    }, 

    dev: { 
    constants: { 
     ENV: 'dev' 
    } 
    } 
} 

編譯:

grunt.registerTask('build', function(target) { 
    grunt.task.run([ 
     'ngconstant:' + target 
    ]) 
}) 

$ grunt build:local

當產生config.js,下一步就是將其包含在你的app.js中

angular.module('myApp', ['config'])

+0

Maven是針對Java項目的。與JS無關。你可以告訴我一個「config.js」的例子嗎? –