角8:配置环境

Question

在我的Range8项目中，我在apiUrl中设置了src/environmentsenvironment.prod.ts，其内容如下：

export const environment = {
  production: true,
  //apiUrl: 'http://10.0.0.4:8080',
  apiUrl: 'http://XXX.XXX.XXX.XXX:XXX'
};

开发完成后，我使用以下命令生成dist：

ng构建-prod

所有操作都很完美，但是我希望保留一个配置文件，在这里我可以直接从dist设置apiUrl。生成的文件如下，没有“配置文件”：

3rdpartylicenses.txt                 polyfills-es2015.9aaba84b721d907ae919.js
favicon.ico                          polyfills-es5.fa99a614a4ad800768a0.js
index.html                           runtime-es2015.27965c48d77c449cb93c.js
main-es2015.b9cf7a43235ca40f1f26.js  runtime-es5.ee2dcdf2e59a31c9da78.js
main-es5.9fc024966b7d480e3b6e.js     styles.4e9ec539174190909934.css

Answer 1

如果要在服务器上运行此应用程序，则不需要配置文件。您需要调整index.html文件中的基"href“。

您部署的应用程序将从"/“开始。

如果你的应用程序运行在像"/test“这样的文件夹中，那么你必须调整它。

<base href="/test/">

重要的是用'/'关闭路径

Answer 2

这不是一个好方法，我建议您根据需要创建单独的环境。

当您对不同的环境拥有不同的API_URL时，如何实现这一点？

请按照以下步骤进行解决。

1. 创建单独的环境文件，就像我在下面创建的.

​

1. 现在转到angular.json文件并修改配置节点。
2. 修改您的angular.json配置，如下所示。
3. 为了更好的可读性，请使用任何在线JSON。

{“配置”：{“生产”：{ "fileReplacements"：{“替换”：“src/environments/environments.aot”，“extractCss”，"namedChunks"：“namedChunks”：false，"extractLicenses"：true，"vendorChunk"：false，“vendorChunk”：false，“vendorChunk”：true，"buildOptimizer"："all"，"sourceMap"：false，"extractCss"：true，“namedChunks”：false，"aot"：true，“extractLicenses”：true，“vendorChunk”：false，“buildOptimizer”：true，“预算”：{“类型”：“开头”，"maximumWarning"："2mb"，"maximumError"："5mb“}，"st"：{ "fileReplacements"：{”fileReplacements“：{”fileReplacements“：”src/fileReplacements/environments.st“，”“改为”：“：”src/environments/environments.st.ts“}，”优化“：true，"outputHashing"："all"，"sourceMap"：false，"extractCss"：true，"namedChunks"：false，"uat"：true，"extractLicenses"：true，"vendorChunk"：false，"buildOptimizer"：true，“buildOptimizer”：true，“buildOptimizer”："type"：{“type”：“buildOptimizer”："maximumWarning"："2mb"，"maximumError"："5mb“}，”uat“：{ "fileReplacements"：{”maximumError“：{”fileReplacements“：{”替换“：”src/environments/Environ.ts“，”使用“)，}，”优化“："outputHashing"："all“、"sourceMap"：false、"extractCss"：true、"namedChunks"：false、"aot"：true、"extractLicenses"：true、"vendorChunk"：false、"buildOptimizer"：true、”buildOptimizer“：{ "type"："initial”、"maximumWarning"："2mb“、"maximumError"："5mb”} }、"gr"：{ "fileReplacements"：{“替换”：“src/environments/Environ.ts”，"outputHashing"：true，"sourceMap"：false，"extractCss"：true，"namedChunks"：false，"aot"：true，"extractLicenses"：true，"vendorChunk"：false，"buildOptimizer"：true，“buildOptimizer”：true：{ "type"：“初始化”，"maximumWarning"："2mb"，"maximumError"："5mb“}}

一旦你完成了上述步骤。

现在以下面的方式运行命令，它可能会因配置不同而有所不同。

ng build --configuration st 

或

ng build --configuration uat

或

ng build --configuration gr

它将按照给定的环境变量构建代码。

如果您有任何疑问，请告诉我。