angular - Webpack 提供的 Angular 2 App 的基于环境的属性?

标签 angular webpack jhipster

我正在使用由 JHipster 生成并由 Spring Boot 服务器提供服务的独立 Angular 控制台。我希望根据环境(本地、开发、生产等)提供具有不同属性的应用程序。

I see a lot of posts about configuring the webpack build per-environment ,但我需要将 URL 和其他数据直接指定到我的 Angular 2 4.x 应用程序中——这些数据会改变我是在开发中还是在生产中运行应用程序。当我们通过 webpack 启动 Angular 时,这种类型的每环境配置是否可行?

最佳答案

我推荐 dotenv-webpack插件。

webpack.config.js

const  Dotenv  =  require('dotenv-webpack');
...
plugins: [
   new  Dotenv({
      path:  './.env'
   })
]

.env

URL=http://example.com
ENV=PROD
...

这允许您使用 process.env 访问环境变量:

constructor(private http:HttpClient) {
     http.get(`${process.env.URL}`).subscribe(t=> {
        ...
     });
}

环境变量在构建时被替换。

关于angular - Webpack 提供的 Angular 2 App 的基于环境的属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47898424/

相关文章:

Angular 检查模板中的 observable 是否为 null

angular - 运行 Angular 6 SPA 时出错

maven - JHipster 配置 Maven 包装代理

angular - Jhipster 启动速度非常慢 - 启动空白 Bootstrap 应用程序需要 2 小时

angular - 多指令选择器 - 查找模板中使用了哪个选择器

javascript - Angular2 将函数结果传递给子组件 - "this.bar is not a function"

angular - 如何在 HTML 代码中访问 FormControl 值

webpack - Vue 和 webpack 警告

javascript - Webpack extract-text-plugin 不生成 css 文件

java - 如何在 Angular 5中未经授权使用主页中的实体数据