Ng-packagr: angular-cli environment

Created on 4 Dec 2017 · 4Comments · Source: ng-packagr/ng-packagr

Type of Issue

[x ] Bug Report
[ ] Feature Request

Description

I'm trying to export parts of an existing angular app as a library. My modules have components and services. My components works with my "myHttpClient.service" which can access to the information through specific database. The database depends from an enviroment ( production or dev). When I ran the script the process doesn´t find the environment.

The console log is:
Building Angular library
Generating bundle for @artica/core
Cleaning bundle build directory
Processing assets
Running ngc

BUILD ERROR
Error at C:/Users/cnotario/workspace/artica-web-modules/src/app/core/.ng_pkg_build/@artica-core/ts/servicios/myHttpClient.service.ts:15:27: Cannot find module '../../../environments/environment'.

This is myHttpClient.service.ts: and the environment import

This is my app structure:

How To Reproduce

1.Create a typical angular-cli app with a feature module.
2.Create ng-packagr configuration inside src/app/name-module/
3.Create an component.ts or service.ts and imports environment -> import {environment} from '../../../environments/environment';

Expected Behaviour

The library builds without error or How could my service access to enviroment without error?

Version Information

ng-packagr: 1.6.0
node: v6.10.1
@angular: v4.4.6
rxjs: 5.5.2
zone.js: 0.8.14
```

question

Source

cnotarioArtica

Most helpful comment

@cnotarioArtica This is a great use case for Dependency Injection. Since ngPackagr doesn't know about these environment files it will fail trying to import them. My suggestion would be to pass the environment to your module when you import it. and use it as a provided value

Ex:

// in your lib module create a static "config" method
@NgModule({ ... })
class MyLibModule {
  static configure(env): ModuleWithProviders {
    return {
      ngModule: MyLibModule,
      providers: [{ provide: 'env', useValue: env }]
    }
  }
}

// in your app module pass in the environment
@NgModule({
  imports: [MyLibModule.configure(environment)]
})
class AppModule { }

// Now your Lib classes can inject your env token and will have access to the environment
@Injectable()
class MyLibService {
  constructor(@Inject('env') environment) {}
}

Hope this helps!

deebloo on 5 Dec 2017

👍6

All 4 comments

Ex:

// in your lib module create a static "config" method
@NgModule({ ... })
class MyLibModule {
  static configure(env): ModuleWithProviders {
    return {
      ngModule: MyLibModule,
      providers: [{ provide: 'env', useValue: env }]
    }
  }
}

// in your app module pass in the environment
@NgModule({
  imports: [MyLibModule.configure(environment)]
})
class AppModule { }

// Now your Lib classes can inject your env token and will have access to the environment
@Injectable()
class MyLibService {
  constructor(@Inject('env') environment) {}
}

Hope this helps!

deebloo on 5 Dec 2017

👍6

Yes, agree!

The environment is a build time thing. Whether it’s prod or dev is known at app build by the cli. So it’s best to pass it as a param to the lib.

Cheers, David

On 5. Dec 2017, at 13:23, Danny Blue notifications@github.com wrote:

@cnotarioArtica since ngPackagr doesn't know about these environments files it will fail on them. My suggestion would be to pass the environment to your module when you import it. and use it as a provided value

Ex:

// in your lib module create a static "config" method
@NgModule({ ... })
class MyLibModule {
static configure(env): ModuleWithProviders {
return {
ngModule: MyLibModule,
providers: [{ provide: 'env', useValue: env }]
}
}
}

// in your app module pass in the environment
@NgModule({
imports: [MyLibModule.configure(environment)]
})
class AppModule { }

// Now in your Lib classes you can inject your env token and will have access to the environment
@Injectable()
class MyLibService {
constructor(@Inject('env') environment) {}
}
Hope this helps!

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub, or mute the thread.

dherges on 5 Dec 2017

Ok! Thanks very much!

cnotarioArtica on 7 Dec 2017

👍1

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

_{_This action has been performed automatically by a bot._}