2016-08-19 7 views
0

私は私のapp.ts開発のためにAureliaでAPI BaseUrlを変更するにはどうすればよいですか?

constructor(container: Container) { 
    let client: HttpClient = new HttpClient; 
    client.configure(config => { 
     config.useStandardConfiguration() 
      .withBaseUrl('http://localhost:8080/') 
      .withDefaults({ 
       credentials: 'include', 
       headers: { 
        Accept: 'application/json' 
       } 
      }); 
    }); 
    container.registerSingleton(HttpClient,() => client); 
} 

に問題がhttp://localhost:8080次のようにあるしているが、地域開発のための唯一の正しいですが、それは、/残りの時間でなければなりません。これは、私がSpring Boot Tomcatとwebpack devを異なるポートでローカルに実行してwebpacks dev serverがtypescriptをホットリビルドできるようにするためです。

私は、にconst baseUrl = '/';を表示しています。もちろん、さまざまな環境で異なるセクションがあります。

私は構文はtypescriptですためにほとんど意味がないことを、この

var apiBaseUrl = baseUrl; 
... 
case 'development': 
    process.env.NODE_ENV = 'development'; 
    apiBaseUrl = 'http://localhost:8080'; 
... 
require('@easy-webpack/config-aurelia') 
     ({ root: rootDir, src: srcDir, title: title, baseUrl: baseUrl, apiBaseUrl: apiBaseUrl }), 

は私がindex.html

<title><%- webpackConfig.metadata.title %></title> 

で使用されるこれらの変数を参照してください追加しています。 app.tsではどのようにこれらを使用しますか?

更新私はwebpack devにはサーバがproxyというオプションがあることに気付きました。私は現在のwebpack設定にどのように統合するのか分かりません。

"use strict"; 

/** 
* To learn more about how to use Easy Webpack 
* Take a look at the README here: https://github.com/easy-webpack/core 
**/ 
const easyWebpack = require('@easy-webpack/core'); 
const generateConfig = easyWebpack.default; 
const get = easyWebpack.get; 
const path = require('path'); 
const ENV = process.env.NODE_ENV && process.env.NODE_ENV.toLowerCase() || 'development'; 
var config; 

// basic configuration: 
const title = 'RPF'; 
const baseUrl = '/'; 
const rootDir = path.resolve(); 
const srcDir = path.resolve('src'); 
const outDir = path.resolve('dist'); 

const coreBundles = { 
    bootstrap: [ 
     'aurelia-bootstrapper-webpack', 
     'aurelia-polyfills', 
     'aurelia-pal', 
     'aurelia-pal-browser', 
     'regenerator-runtime', 
     'bluebird' 
    ], 
    // these will be included in the 'aurelia' bundle (except for the above bootstrap packages) 
    aurelia: [ 
     'aurelia-bootstrapper-webpack', 
     'aurelia-binding', 
     'aurelia-dependency-injection', 
     'aurelia-event-aggregator', 
     'aurelia-framework', 
     'aurelia-history', 
     'aurelia-history-browser', 
     'aurelia-loader', 
     'aurelia-loader-webpack', 
     'aurelia-logging', 
     'aurelia-logging-console', 
     'aurelia-metadata', 
     'aurelia-pal', 
     'aurelia-pal-browser', 
     'aurelia-path', 
     'aurelia-polyfills', 
     'aurelia-route-recognizer', 
     'aurelia-router', 
     'aurelia-task-queue', 
     'aurelia-templating', 
     'aurelia-templating-binding', 
     'aurelia-templating-router', 
     'aurelia-templating-resources', 
    ] 
}; 

const baseConfig = { 
    entry: { 
     'app': [ /* this is filled by the aurelia-webpack-plugin */ ], 
     'aurelia-bootstrap': coreBundles.bootstrap, 
     'aurelia': coreBundles.aurelia.filter(function (pkg) { 
      return coreBundles.bootstrap.indexOf(pkg) === -1 
     }) 
    }, 
    output: { 
     path: outDir 
    } 
}; 

// advanced configuration: 
switch (ENV) { 
    case 'production': 
     config = generateConfig(
      baseConfig, 

      require('@easy-webpack/config-env-production') 
      ({ compress: true }), 

      require('@easy-webpack/config-aurelia') 
      ({ root: rootDir, src: srcDir, title: title, baseUrl: baseUrl }), 

      require('@easy-webpack/config-tslint') 
      ({ emitErrors: true, failOnHint: true }), 
      require('@easy-webpack/config-typescript')(), 
      require('@easy-webpack/config-html')(), 

      require('@easy-webpack/config-css') 
      ({ filename: 'styles.css', allChunks: true, sourceMap: false }), 

      require('@easy-webpack/config-fonts-and-images')(), 
      require('@easy-webpack/config-global-bluebird')(), 
      require('@easy-webpack/config-global-jquery')(), 
      require('@easy-webpack/config-global-regenerator')(), 
      require('@easy-webpack/config-generate-index-html') 
      ({ minify: true }), 

      require('@easy-webpack/config-common-chunks-simple') 
      ({ appChunkName: 'app', firstChunk: 'aurelia-bootstrap' }), 

      require('@easy-webpack/config-copy-files') 
      ({ patterns: [ { from: 'favicon.ico', to: 'favicon.ico' } ] }), 

      require('@easy-webpack/config-uglify') 
      ({ debug: false }) 
     ); 
     break; 

    case 'test': 
     config = generateConfig(
      baseConfig, 

      require('@easy-webpack/config-env-development') 
      ({ devtool: 'inline-source-map' }), 

      require('@easy-webpack/config-aurelia') 
      ({ root: rootDir, src: srcDir, title: title, baseUrl: baseUrl }), 

      require('@easy-webpack/config-typescript') 
      ({ options: { doTypeCheck: false, compilerOptions: { sourceMap: false, inlineSourceMap: true } } }), 

      require('@easy-webpack/config-html')(), 

      require('@easy-webpack/config-css') 
      ({ filename: 'styles.css', allChunks: true, sourceMap: false }), 

      require('@easy-webpack/config-fonts-and-images')(), 
      require('@easy-webpack/config-global-bluebird')(), 
      require('@easy-webpack/config-global-jquery')(), 
      require('@easy-webpack/config-global-regenerator')(), 
      require('@easy-webpack/config-generate-index-html')(), 

      require('@easy-webpack/config-test-coverage-istanbul')() 
     ); 
     break; 

    default: 
    case 'development': 
     process.env.NODE_ENV = 'development'; 
     config = generateConfig(
      baseConfig, 

      require('@easy-webpack/config-env-development')(), 

      require('@easy-webpack/config-aurelia') 
      ({ root: rootDir, src: srcDir, title: title, baseUrl: baseUrl }), 

      require('@easy-webpack/config-typescript')(), 
      require('@easy-webpack/config-html')(), 

      require('@easy-webpack/config-css') 
      ({ filename: 'styles.css', allChunks: true, sourceMap: false }), 

      require('@easy-webpack/config-fonts-and-images')(), 
      require('@easy-webpack/config-global-bluebird')(), 
      require('@easy-webpack/config-global-jquery')(), 
      require('@easy-webpack/config-global-regenerator')(), 
      require('@easy-webpack/config-generate-index-html') 
      ({ minify: false }), 

      require('@easy-webpack/config-copy-files') 
      ({ patterns: [ { from: 'favicon.ico', to: 'favicon.ico' } ] }), 

      require('@easy-webpack/config-common-chunks-simple') 
      ({ appChunkName: 'app', firstChunk: 'aurelia-bootstrap' }) 
     ); 
     break; 
} 

module.exports = config; 

答えて

1

私はいくつかのサブパスを含めるために、私の実際のAPI BASEURLを変更しなければならなかった...しかし、私は私が尋ねた何をしませんdevServerプロキシの設定を追加することができましたが、私の問題を解決します。

case 'development': 
    process.env.NODE_ENV = 'development'; 
    config = generateConfig(
     baseConfig, 
     { devServer: { proxy: { '/v0/*': 'http://localhost:8080' } } }, 
関連する問題