在导入的模块中使用 Angular Cli 的环境 [英] Using Angular Cli's environment with an imported module
问题描述
我在模块中使用 angular-cli 的环境变量.当我在另一个项目中导入我的模块时,是否可以在编译和运行时使用我项目的环境变量?
I'm using angular-cli's environment variables in a module. When I import my module in another project, is it possible to use my project's environment variables at compilation and runtime ?
我的模块
myModule/
src/
/app
my.service.ts
/environments
environment.prod.ts
environment.ts
app.module.ts
etc.
我的模块是 my.service.ts
import { environment } from './environments/environment';
@Injectable()
export class MyService {
private title = environment.title;
showTitle(): string {
return this.title;
}
etc.
}
我模块的 environment.ts
export const environment = {
production: false,
title: 'My Module in dev mode'
}
我模块的 environment.prod.ts
export const environment = {
production: true,
title: 'My Module in prod mode'
}
我的项目
myProject/
src/
/app
app.component.ts
/environments
environment.prod.ts
environment.ts
app.module.ts
etc.
我项目的 AppComponent
Component({
selector: 'app-root',
template: `<h1>{{title}}</h1>`
})
export class AppComponent {
title: string;
constructor(myService: MyService) {
this.title = myService.showTitle();
}
}
我项目的环境.ts
export const environment = {
production: false,
title: 'My Project in dev mode'
}
我项目的 environment.prod.ts
export const environment = {
production: true,
title: 'My Project in prod mode'
}
目前,当我运行我的项目时,我看到我的模块处于开发模式,但我想看到我的项目处于开发模式.
Currently, when I run my project, I see My Module in dev mode, but I'd want to see My Project in dev mode.
有没有办法从诸如 import { environment } from '/src/my-app/environments/environment 的相对 url import
environment.ts
' ?
Is there a way to import environment.ts
from a relative url like import { environment } from '/src/my-app/environments/environment
' ?
推荐答案
据我所知,您有一个项目:'MyProject' 和一个外部模块 'MyModule',并且您想在其中导入 'MyProject' 环境变量MyModule"服务MyService".
From what I understand is that you've a project: 'MyProject' and an external module 'MyModule' and you want to import 'MyProject' environment variables in the 'MyModule' service 'MyService'.
恕我直言,从设计的角度来看,最好将环境变量作为参数传递给您打算使用它的MyService".
IMHO, From a design perspective, It's better if you pass the environment variable as an argument to 'MyService' where you intend to use it.
但是,如果您坚持要导入它,要导入这两个环境变量,请在您的 my.service.ts
试试这个:
However, If you insist on importing it, to import both the environment variables, In your my.service.ts
Try this:
import { myModuleEnvironment } from './environments/environment';
import { myProjectEnvironment } from '../../../src/app/environments/environment
考虑您的项目文件夹结构:
Considering your project folder structure to be:
myProject/
myModule/
src/
/app
my.service.ts
/environments
environment.prod.ts
environment.ts
app.module.ts
src/
/app
app.component.ts
/environments
environment.prod.ts
environment.ts
app.module.ts
etc.
更多说明:
TypeScript 导入规则 与 nodeJS 具有相同的约定.如果导入以点开头:
TypeScript import rules has same convention as nodeJS. If an import begins with a dot:
import {library} from './some/library/path';
然后将其视为声明导入的文件的相对路径.但是,如果它是绝对路径(例如导入 angular2 组件):
Then it is treated as a relative path from the file that declares the import. If however it is an absolute path (e.g. importing angular2 Component):
import {Component} from '@angular/core';
因此,Typescript 认为这是一个外部模块,它会沿着文件树向上移动,直到找到 package.json
文件.然后进入node_modules
文件夹,找到一个与导入同名的文件夹(在上面的例子中:@angular/core
).然后在模块的 package.json 中查找主 .d.ts 或 .ts 文件,然后加载该文件,或者查找与指定名称相同的文件,或 index.d.ts或 index.ts 文件.
So, Typescript consider this to be an external module, it goes up the file tree till it finds package.json
file.
Then go into the node_modules
folder, and find a folder with the same name as the import (in the above example: @angular/core
).
Then looks in the package.json of the module for the main .d.ts or .ts file, and then loads that, or will look for a file that has the same name as the one specified, or an index.d.ts or index.ts file.
这篇关于在导入的模块中使用 Angular Cli 的环境的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!