javascript - 用于开发和生产构建的 Webpack Angular 应用程序 API URL 配置

Question

我有一个具有以下简单配置文件 config.js 的 Angular 应用程序:

export default function(app) {
  app.constant('config', {apiUrl: 'https://localhost:8080'});
};

由 Webpack 入口点 app.js 导入:

import config from './config';
config(app);

我想在进行生产构建时使用不同的 apiUrl。

在 Webpack 中最简单的方法是什么？

Answer 1

https://stackoverflow.com/a/34032050/1610981 上有一个类似的问题

它关系到你可以使用http://webpack.github.io/docs/list-of-plugins.html#defineplugin

config.js 文件应该是这样的:

export default function(app) {
  app.constant('config', {apiUrl: API_URL});
};

在 webpack 配置文件中:

plugins:[
  new webpack.DefinePlugin({
    API_URL: JSON.stringify('https://localhost:8080')
  })
]

您应该有两个 webpack 配置，一个用于开发，另一个用于生产。每一个都定义了API_URL 宏，根据构建执行。