web-dev-qa-db-fra.com

comment changer le chemin de dist-folder dans angular-cli après 'ng build'

Je voudrais utiliser angular-cli avec le noyau asp.net et j'ai besoin de savoir comment changer le chemin d'accès de distdossier

angularangular-cli
101
cuppy

Vous pouvez mettre à jour le dossier de sortie dans .angular-cli.json:

"outDir": "./location/toYour/dist"
54
shaun bradridge

La méthode la plus courante consiste à mettre à jour la propriété outDir dans .angular-cli.json.

L'argument de la commande ng build--output-path (ou -op) est également pris en charge, ce qui peut être utile si vous souhaitez plusieurs valeurs, vous pouvez les enregistrer dans votre package.json sous npm. les scripts.

Attention: La propriété .angular-cli.json n'est PAS appelée output-path comme le réponse actuellement acceptée par @ cwill747 = dit. C'est l'argument ng build uniquement.

Elle s'appelle outDir comme mentionné ci-dessus, et il s'agit d'une propriété située sous la propriété apps.

.

P.S.

(Décembre 2017)

un an après l’ajout de cette réponse , une personne a ajouté une nouvelle réponse contenant essentiellement les mêmes informations et l’affiche originale a modifié la réponse acceptée en un an. réponse tardive contenant les mêmes informations dans la première ligne de celle-ci.

169
Meligy

Pour Angular 6+, les choses ont un peu changé.

Définir où ng build génère les fichiers d'application

La configuration de Cli est maintenant effectuée dans angular.json (remplacé par .angular-cli.json) dans le répertoire racine de votre espace de travail. Le chemin de sortie dans angular.json par défaut devrait ressembler à ceci (lignes non pertinentes supprimées):

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

Évidemment, cela générera votre application dans WORKSPACE/dist/my-app-name. Modifiez outputPath si vous préférez un autre répertoire.

Vous pouvez écraser le chemin de sortie à l'aide d'arguments de ligne de commande (par exemple, pour les travaux de CI):

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

S.a. https://github.com/angular/angular-cli/wiki/build

Hébergement angular app dans le sous-répertoire

Définir le chemin de sortie indiquera angular où placer les fichiers "compilés", mais quel que soit le chemin de sortie utilisé lors de l'exécution de l'application, angular supposera toujours que l'application est hébergée. dans la racine du document du serveur Web.

Pour que cela fonctionne dans un sous-répertoire, vous devez définir le href de base.

Dans angular.json:

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

Cli:

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

Si vous ne savez pas où l'application sera hébergée lors de la création, vous pouvez modifier la balise de base dans index.html généré.

Voici un exemple de la manière dont nous procédons dans notre conteneur Docker:

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
51
Christoph Lütjen

Vous pouvez également utiliser la CLI, comme par exemple:

ng build -prod --output-path=production

# or

ng serve --output-path=devroot
44
Marian Zburlea

La seule chose qui a fonctionné pour moi a été de changer outDir en angular-cli.json ET src/tsconfig.json.

Je voulais mon dossier dist en dehors du dossier de projet angular. Si je ne modifiais pas non plus le paramètre dans src/tsconfig.json, Angular CLI émettait des avertissements chaque fois que je construisais le projet.

Voici les lignes les plus importantes ...

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

Et ...

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

Attention: La réponse correcte est ci-dessous. Cela ne fonctionne plus

Créez un fichier appelé .ember-cli dans votre projet et incluez-y le contenu:

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

La CLI angulaire utilise maintenant des fichiers d’environnement pour ce faire.

Tout d’abord, ajoutez une section environments au angular-cli.json

Quelque chose comme :

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

Et puis à l'intérieur du fichier d'environnement (environments/environment.prod.ts dans ce cas), ajoutez quelque chose comme:

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

maintenant quand tu cours:

ng build --prod

il sortira dans le dossier ./whatever/dist/.

7
swestner

pour les pages github que j'utilise

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

C’est ce que copie la sortie dans le dossier docs: --output-path=docs

3
unos baghaii

Une autre option serait de définir le chemin de la racine Web sur le dossier angular cli dist. Dans votre Program.cs lors de la configuration de WebHostBuilder, dites simplement

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

ou quel que soit le chemin d'accès à votre répertoire est.

1
Christian Götze