используя webpack 2 DefinePlugin с проектом на основе angular-cli

Я пытаюсь преобразовать проект angular2 с webpack2 в проект на основе angular-cli.

если я правильно понял, angular-cli теперь поддерживает webpack. в моем исходном проекте я ввел следующее app.config.js:

module.exports =  {
    webServer: {
        appBaseHref : JSON.stringify("/")
    },
    auth0: {
        apiKey: JSON.stringify("API_KEY"),
        domain: JSON.stringify("DOMAIN.auth0.com"),
        callbackUrl: JSON.stringify("CALLBACK_URL")
    }
};

добавив в файл webpack.config.js следующее:

const appConfig = require("./config/app.config");
const DefinePlugin = require("webpack/lib/DefinePlugin");
...
module.exports = {
    plugins: [
       new DefinePlugin({
           APP_CONFIG: appConfig
       }),
...

затем в моем машинописном проекте я бы объявил APP_CONFIG с declare var APP_CONFIG:any;, а затем использовал бы его свойства. как я могу внедрить такой объект в проект angular-cli?

Благодарность


webpack angular angular-cli webpack-2
person ufk    schedule 14.10.2016    source источник
comment
Разве вы не можете просто сделать сервис для этого?   -  person Chrillewoodz    schedule 14.10.2016
comment
@Chrillewoodz - да .. Я могу .. пытаюсь понять, почему я сделал это с помощью веб-пакета, но ничего не получил :) что мне делать? Вы хотите опубликовать это как ответ? удалить этот вопрос?   -  person ufk    schedule 14.10.2016
comment
Дай мне минутку.   -  person Chrillewoodz    schedule 14.10.2016
comment
Итак, я хочу того же — чтобы я мог вводить номера сборки. Не уверен, что ответ службы будет работать для меня. Я хотел бы иметь глобальное значение, например APP_VERSION, и установить для него значение childProcess.execSync('git rev-list HEAD --count').toString();.   -  person nycynik    schedule 17.03.2017

Ответы (1)


arrow_upward
2
arrow_downward

Вот простой пример, в котором используется обычный сервис с методами set и get:

import {Injectable} from '@angular/core';

@Injectable()

export class AppConfigService {

  public config: any = {
    apiKey: '[api_key]',
    domain: '[domain]',
    callbackUrl: '[callbackUrl]'
  }

  constructor() {}

  /* Allows you to update any of the values dynamically */
  set(k: string, v: any): void {
    this.config[k] = v;
  }

  /* Returns the entire config object or just one value if key is provided */
  get(k: string): any {
    return k ? this.config[k] : this.config;
  }
}

Для более сложных вариантов использования вы можете вместо этого преобразовать его в наблюдаемое, но я не вижу в этом необходимости в этом простом случае.

person Chrillewoodz    schedule 14.10.2016