Я просто хотел бы предоставить комплексное решение, потому что мне потребовалось довольно много времени, чтобы спасти вас сейчас:).
Моя цель состояла в том, чтобы иметь разные конфигурации среды для разных компаний,поскольку веб-приложение будет использоваться различными компаниями с небольшими изменениями (включение / отключение модулей, изменение логотипа, изменение цвета темы и т. д.).
- Настройка
launchSettings.json
(в рамках вашего веб-проекта всвойства).Добавьте следующий код под profiles
:
"Staging": {
"commandName": "IISExpress",
"launchBrowser": true,
"environmentVariables": {
"ASPNETCORE_ENVIRONMENT": "Staging"
},
"applicationUrl": "https://localhost:5001;http://localhost:5000"
}
Где Staging
- это имя, если вы хотите имя среды.Это обеспечит возможность выбора этой конфигурации в Start
в Visual Studio.
Для получения дополнительной информации: прочтите это
Добавьте собственный файл appsettings.Staging.json
в корневой каталог решения для пользовательских настроек приложения.Хотя это в основном важно для локального тестирования, потому что в вашем CI / CD вы, вероятно, захотите настроить замен .Если вы хотите использовать конкретный appsettings.Staging.json
в производственной среде, установите ASPNETCORE_ENVIRONMENT
на Staging
на сервере (для службы приложений Azure в разделе Конфигурация => Настройки приложения).
В вашем Startup.cs
добавьте следующий else if
блок.
app.UseSpa(spa =>
{
// To learn more about options for serving an Angular SPA from ASP.NET Core,
// see https://go.microsoft.com/fwlink/?linkid=864501
spa.Options.SourcePath = "ClientApp";
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
}
else if (env.EnvironmentName == "Staging")
{
#if DEBUG
spa.UseAngularCliServer(npmScript: "start-stagingdebug");
#endif
}
});
Обратите внимание на #if DEBUG
, это необходимо, потому что вы не хотите выполнять это наразвернутая среда, однако для локального запуска angular вам нужно это вызвать, иначе вы получите страницу с ошибкой.Как вы можете заметить, я добавляю debug
к имени среды, я объясню позже.На данный момент вы должны понимать, что env.IsDevelopment()
будет ложным, и поэтому вам придется работать, чтобы убедиться, что ваше угловое приложение все еще будет собираться и обслуживаться при локальном запуске приложения.
Измените
angular.json
, под
architect => build => configurations
, добавьте
2 новые конфигурации:
"staging": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.toptechneut.ts"
},
{
"replace": "src/assets/img/logo-icon.png",
"with": "src/assets/img/staging/logo-icon.png"
},
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
]
},
"stagingdebug": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.toptechneut.ts"
},
{
"replace": "src/assets/img/logo-icon.png",
"with": "src/assets/img/staging/logo-icon.png"
},
]
}
Если вам немного известно о angular.json
, вы заметите, что вstaging
Я делаю конфигурацию для производственной среды, я буду следить за тем, чтобы мой CI / CD вызывал это (или когда я опубликую свое приложение через VS2017).Для локального тестирования у меня есть другая конфигурация stagingdebug
, так что она по-прежнему сохраняет исходные карты, и я могу отлаживать свой код при локальном запуске.
Добавьте ваш файл environment.staging.ts
в папку environments
для параметров, зависящих от среды.Подробнее об этом, читайте это
измените ваш package.json
, под scripts
, я добавил эти сценарии:
"start-staging": "ng serve --configuration staging",
"start-stagingdebug": "ng serve --configuration stagingdebug",
"build-staging": "ng build --configuration staging",
"build-stagingdebug": "ng build --configuration stagingdebug",
То же самое здесь: для локальной разработки я называю конфигурацию с добавлением debug
.
На данный момент вы должны иметь возможность перейти на новую конфигурацию в Visual Studio и работать в соответствии сВаши новые конфигурации среды!
Измените ваш
.csproj
, спасибо за это pjominet.Обратите внимание, что еще раз, это только для публикации вашего веб-приложения, а не для локальной отладки.
<Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
<!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
<Exec WorkingDirectory="$(SpaRoot)" Command="npm install" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build-core" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run buildprod" Condition="'$(Configuration)' == 'Release'" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build-staging" Condition="'$(Configuration)' == 'Staging'" />
<Exec WorkingDirectory="$(SpaRoot)" Command="npm run build:ssr -- --prod" Condition=" '$(BuildServerSideRenderer)' == 'true' " />
<!--rest below here-->
Я изменил мой, чтобы вызвать правильный script
, который я определил в моем package.json
потому что по какой-то причине мой CI не принимал дополнительные команды за ним, пока я использовал ответ pjominet.
Если вы используете DevOps Azure, вам просто нужно изменить значение переменной BuildConfiguration
на Staging
.Если вы выполнили все шаги, то это должно быть успешно построено.