CLI angulaire - commande ng build
Syntaxe
ng build <project> [options]
ng b <project> [options]La commande ng build compile une application / bibliothèque angulaire dans un répertoire de sortie nommé dist au chemin donné. Les options sont des paramètres facultatifs.
Arguments
| N ° Sr. | Argument et syntaxe | La description |
|---|---|---|
| 1 | <projet> | Le nom de l'application ou de la bibliothèque à créer. |
Options
| N ° Sr. | Option et syntaxe | La description |
|---|---|---|
| 1 | --aot = vrai | faux |
Construire à l'aide de la compilation Ahead of Time. Par défaut: faux. |
| 2 | --baseHref = baseHref | URL de base de l'application en cours de création. |
| 3 | --buildEventLog = buildEventLog | EXPERIMENTAL Chemin du fichier de sortie pour les événements Build Event Protocol. |
| 4 | --buildOptimizer = true | false | Active les optimisations '@ angular-devkit / build-optimizer' lors de l'utilisation de l'option 'aot'. Par défaut: faux. |
| 5 | --commonChunk = true | false |
Utilisez un ensemble distinct contenant du code utilisé dans plusieurs ensembles. Par défaut: faux. |
| 6 | --configuration = configuration | Une cible de construction nommée, comme spécifié dans la section "configurations" de angular.json. Chaque cible nommée est accompagnée d'une configuration d'options par défaut pour cette cible. La définition de ceci remplace explicitement l'indicateur "--prod". Alias: -c. |
| sept | --crossOrigin = aucun | anonyme | utiliser les informations d'identification |
Définissez le paramètre d'attribut crossorigin des éléments qui fournissent la prise en charge CORS. Par défaut: aucun. |
| 8 | --deleteOutputPath = true | false |
Supprimez le chemin de sortie avant la construction. Par défaut: vrai. |
| 9 | --deployUrl = deployUrl | URL où les fichiers seront déployés. |
| dix | --experimentalRollupPass = true | false |
Concaténez les modules avec Rollup avant de les regrouper avec Webpack. Par défaut: faux. |
| 11 | --extractCss = true | false |
Extrayez le css des styles globaux dans des fichiers css au lieu de ceux js. Par défaut: faux. |
| 12 | --extractLicenses = true | false |
Extrayez toutes les licences dans un fichier séparé. Par défaut: faux. |
| 13 | --forkTypeChecker = true | false |
Exécutez le vérificateur de type TypeScript dans un processus forké. Par défaut: vrai. |
| 14 | --help = true | false | json | JSON |
Affiche un message d'aide pour cette commande dans la console. Par défaut: faux. |
| 15 | --i18nMissingTranslation = avertissement | erreur | ignorer |
Comment gérer les traductions manquantes pour i18n. Par défaut: avertissement. |
| 16 | --index = index | Configure la génération de l'index HTML de l'application. |
| 17 | --localize = true | false | |
| 18 | --main = principal | Chemin complet du point d'entrée principal de l'application, par rapport à l'espace de travail actuel. |
| 19 | --namedChunks = true | false |
Utilisez le nom de fichier pour les blocs chargés paresseusement. Par défaut: vrai. |
| 20 | --ngswConfigPath = ngswConfigPath | Chemin vers ngsw-config.json. |
| 21 | --optimization = true | false | Active l'optimisation de la sortie de construction. |
| 22 | --outputHashing = none | all | media | bundles |
Définissez le mode de hachage du contournement du cache des noms de fichiers de sortie. Par défaut: aucun. |
| 23 | --outputPath = chemin de sortie | Le chemin complet du nouveau répertoire de sortie, par rapport à l'espace de travail actuel. Par défaut, écrit la sortie dans un dossier nommé dist / dans le projet actuel. |
| 24 | --sondage | Activez et définissez la période d'interrogation de surveillance des fichiers en millisecondes. |
| 25 | --polyfills = polyfills | Chemin complet du fichier polyfills, par rapport à l'espace de travail actuel. |
| 26 | --preserveSymlinks = true | false |
N'utilisez pas le chemin réel lors de la résolution des modules. Par défaut: faux. |
| 27 | --prod = vrai | faux | Abréviation de "--configuration = production". Lorsque true, définit la configuration de construction sur la cible de production. Par défaut, la cible de production est configurée dans la configuration de l'espace de travail de telle sorte que toutes les versions utilisent le regroupement, le tremblement d'arborescence limité et l'élimination limitée du code mort. |
| 28 | --progress = true | false |
Enregistrez la progression dans la console pendant la construction. Par défaut: vrai. |
| 27 | --resourcesOutputPath = resourcesOutputPath | Chemin où les ressources de style seront placées, par rapport à outputPath. |
| 28 | --serviceWorker = true | false |
Génère une configuration de service worker pour les versions de production. Par défaut: faux. |
| 29 | --showCircularDependencies = true | false |
Afficher les avertissements de dépendance circulaire sur les builds. Par défaut: vrai. |
| 30 | --sourceMap = true | false |
Cartes de source de sortie. Par défaut: vrai. |
| 31 | --statsJson = vrai | faux |
Génère un fichier 'stats.json' qui peut être analysé à l'aide d'outils tels que 'webpack-bundle-analyzer'. Par défaut: faux. |
| 32 | --subresourceIntegrity = true | false |
Active l'utilisation de la validation d'intégrité des sous-ressources. Par défaut: faux. |
| 33 | --tsConfig = tsConfig | Chemin complet du fichier de configuration TypeScript, par rapport à l'espace de travail actuel. |
| 34 | --vendorChunk = true | false |
Utilisez un ensemble distinct contenant uniquement les bibliothèques des fournisseurs. Par défaut: vrai. |
| 35 | --verbose = vrai | faux |
Ajoute plus de détails à la journalisation de la sortie. Par défaut: vrai. |
| 36 | --watch = vrai | faux |
Exécutez la compilation lorsque les fichiers changent. Par défaut: faux. |
| 37 | --webWorkerTsConfig = webWorkerTsConfig | Configuration TypeScript pour les modules Web Worker. |
Commencez par passer à un projet angulaire mis à jour à l'aide de la commande ng generate . Remplacez le contenu de app.component.html par le contenu suivant, puis exécutez la commande.
<app-goals></app-goals>
<router-outlet></router-outlet>Exemple
\>Node\>TutorialsPoint> ng build
Compiling @angular/animations : es2015 as esm2015
Compiling @angular/core : es2015 as esm2015
Compiling @angular/compiler/testing : es2015 as esm2015
Compiling @angular/animations/browser : es2015 as esm2015
Compiling @angular/core/testing : es2015 as esm2015
Compiling @angular/common : es2015 as esm2015
Compiling @angular/platform-browser : es2015 as esm2015
Compiling @angular/common/http : es2015 as esm2015
Compiling @angular/common/testing : es2015 as esm2015
Compiling @angular/platform-browser-dynamic : es2015 as esm2015
Compiling @angular/platform-browser/testing : es2015 as esm2015
Compiling @angular/router : es2015 as esm2015
Compiling @angular/animations/browser/testing : es2015 as esm2015
Compiling @angular/common/http/testing : es2015 as esm2015
Compiling @angular/forms : es2015 as esm2015
Compiling @angular/platform-browser/animations : es2015 as esm2015
Compiling @angular/platform-browser-dynamic/testing : es2015 as esm2015
Compiling @angular/router/testing : es2015 as esm2015
Generating ES5 bundles for differential loading...
ES5 bundle generation complete.
chunk {polyfills} polyfills-es2015.js, polyfills-es2015.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime-es2015.js, runtime-es2015.js.map (runtime) 6.16 kB [entry] [rendered]
chunk {runtime} runtime-es5.js, runtime-es5.js.map (runtime) 6.16 kB [entry] [rendered]
chunk {styles} styles-es2015.js, styles-es2015.js.map (styles) 12.4 kB [initial] [rendered]
chunk {styles} styles-es5.js, styles-es5.js.map (styles) 13.9 kB [initial] [rendered]
chunk {main} main-es2015.js, main-es2015.js.map (main) 61.4 kB [initial] [rendered]
chunk {main} main-es5.js, main-es5.js.map (main) 65 kB [initial] [rendered]
chunk {polyfills-es5} polyfills-es5.js, polyfills-es5.js.map (polyfills-es5) 656 kB [initial] [rendered]
chunk {vendor} vendor-es2015.js, vendor-es2015.js.map (vendor) 2.67 MB [initial] [rendered]
chunk {vendor} vendor-es5.js, vendor-es5.js.map (vendor) 3.11 MB [initial] [rendered]
Date: 2020-06-04T01:31:35.612Z - Hash: d5fd9371cdc40ae353bc - Time: 210494msIci, la commande ng build a construit notre projet TutorialsPoint avec succès.