как изменить путь к папке dist в angular-cli после 'ng build'


112

Я хотел бы использовать angular-cli с ядром asp.net, и мне нужно знать, как я могу изменить путь к папке dist

Ответы:


74

Вы можете обновить выходную папку в .angular-cli.json:

"outDir": "./location/toYour/dist"

14
Можно ли поместить index.html в ./location/toYour/dist и пакеты javascript в подпапку, например ./location/toYour/dist/bundles
Навид Ахмед,

1
Кто-нибудь знает какие-либо обновления по дальнейшей настройке outDir? css / ts / отдельными путями
fidev

190

Более современный способ - обновить outDirсвойство в .angular-cli.json.

ng buildАргумент команды --output-path(или -opдля краткости) по - прежнему поддерживается также, что может быть полезно , если вы хотите использовать несколько значений, вы можете сохранить их в package.jsonкачестве сценариев НПХ.

Осторожно:.angular-cli.json свойство не вызывается , output-pathкак в настоящее время общепринятый ответ на @ cwill747 говорит. Этоng build только аргумент.

Он называется, outDirкак упоминалось выше, и находится в appsсобственности.

.

PS

(Декабрь 2017 г.)

Через год после добавления этого ответа кто-то добавил новый ответ с практически такой же информацией, а исходный постер изменил принятый ответ на ответ с опозданием на 1 год, содержащий ту же информацию в первой строке этого.


3
Можно ли поместить index.html в ./location/toYour/dist и пакеты JavaScript в подпапку, например ./location/toYour/dist/bundles
Навид Ахмед

10
: D PS горький
Сунил Кумар

4
лучший PS, который я видел здесь
Frenkey

он, наверное, продвигает здесь своего друга, это коррупция
Александр Боровой

70

Для Angular 6+ все немного изменилось.

Определите, где ng build создает файлы приложения

Настройка Cli теперь выполняется в angular.json (замененном .angular-cli.json) в корневом каталоге вашей рабочей области. Выходной путь в angular.json по умолчанию должен выглядеть следующим образом (нерелевантные строки удалены):

{
  "projects": {
    "my-app-name": {
    "architect": {
      "options": {
         "outputPath": "dist/my-app-name",

Очевидно, это сгенерирует ваше приложение в WORKSPACE / dist / my-app-name. Измените outputPath, если вы предпочитаете другой каталог.

Вы можете перезаписать выходной путь, используя аргументы командной строки (например, для заданий CI):

ng build -op dist/example
ng build --output-path=dist/example

Sa https://github.com/angular/angular-cli/wiki/build

Размещение приложения angular в подкаталоге

Установка пути вывода сообщит angular, где разместить «скомпилированные» файлы, но, как бы вы ни изменили путь вывода, при запуске приложения angular по-прежнему будет предполагать, что приложение размещено в корне документа веб-сервера.

Чтобы он работал в подкаталоге, вам нужно установить базовый href.

В angular.json:

{
  "projects": {
    "my-app-name": {
    "architect": {
      "options": {
         "baseHref": "/my-folder/",

Cli:

ng build --base-href=/my-folder/

Если вы не знаете, где будет размещаться приложение во время сборки, вы можете изменить базовый тег в сгенерированном index.html.

Вот пример того, как мы это делаем в нашем контейнере докеров:

entrypoint.sh

if [ -n "${BASE_PATH}" ]
then
  files=( $(find . -name "index.html") )
  cp -n "${files[0]}" "${files[0]}.org"
  cp "${files[0]}.org" "${files[0]}"
  sed -i "s*<base href=\"/\">*<base href=\"${BASE_PATH}\">*g" "${files[0]}"
fi


17

Единственное, что сработало для меня, - это изменить outDirоба параметра angular-cli.jsonAND src/tsconfig.json.

Я хотел, чтобы моя dist-папка находилась вне папки проекта angular. Если бы я тоже не изменил настройку src/tsconfig.json, Angular CLI будет выдавать предупреждения всякий раз, когда я создаю проект.

Вот самые важные строчки ...

// angular-cli.json
{
  ...
  "apps": [
    {
      "outDir": "../dist",
      ...
    }
  ],
  ...
}

И ...

// tsconfig.json
{
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    ...
  }
}

2
Потрясающие! Обновить для cli 7x, указанное выше выполнено в angular.jsonи поле есть outputPath( tsconfig настройка выше остается прежней). Hth
EdSF

17

Осторожно: правильный ответ ниже. Это больше не работает

Создайте файл с именем .ember-cliв вашем проекте и включите в него следующее содержимое:

{
   "output-path": "./location/to/your/dist/"
}

9

Angular CLI теперь использует для этого файлы среды.

Сначала добавьте environments раздел вangular-cli.json

Что-то вроде :

{
  "apps": [{
      "environments": {
        "prod": "environments/environment.prod.ts"
      }
    }]
}

А затем внутри файла окружения ( environments/environment.prod.tsв данном случае) добавьте что-то вроде:

export const environment = {
  production: true,
  "output-path": "./whatever/dist/"
};

теперь, когда вы бежите:

ng build --prod

он будет выведен в ./whatever/dist/папку.


1
Похоже, лучший ответ, но Angular CLI по-прежнему публикует мои файлы в папке dist. Версия:angular-cli: 1.0.0-beta.21
NinjaFart

Из Angular CLI Wiki : outDir (строка): выходной каталог для результатов сборки. По умолчанию dist /.
hbthanki

@hbthanki Это переключатель cli, а не свойство json файла среды
swestner

9

для страниц github я использую

ng build --prod --base-href "https://<username>.github.io/<RepoName>/" --output-path=docs

Вот что копирует вывод в папку docs: --output-path=docs


2

Другой вариант - установить путь webroot к папке angular cli dist. В вашем Program.cs при настройке WebHostBuilder просто скажите

.UseWebRoot(Directory.GetCurrentDirectory() + "\\Frontend\\dist")

или каков бы ни был путь к вашему удаленному каталогу.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.