Angular CLI - comando de construção ng
Sintaxe
ng build <project> [options]
ng b <project> [options]
O comando ng build compila um aplicativo / biblioteca angular em um diretório de saída denominado dist em um determinado caminho. As opções são parâmetros opcionais.
Argumentos
Sr. Não. | Argumento e Sintaxe | Descrição |
---|---|---|
1 | <projeto> | O nome do aplicativo ou biblioteca a ser construída. |
Opções
Sr. Não. | Opção e sintaxe | Descrição |
---|---|---|
1 | --aot = true | false | Construa usando a compilação Ahead of Time. Padrão: falso. |
2 | --baseHref = baseHref | URL base do aplicativo que está sendo construído. |
3 | --buildEventLog = buildEventLog | EXPERIMENTAL Caminho do arquivo de saída para eventos Build Event Protocol. |
4 | --buildOptimizer = true | false | Ativa as otimizações '@ angular-devkit / build-optimizer' ao usar a opção 'aot'. Padrão: falso. |
5 | --commonChunk = true | false | Use um pacote separado contendo o código usado em vários pacotes. Padrão: falso. |
6 | --configuration = configuração | Um destino de compilação nomeado, conforme especificado na seção "configurações" do angular.json. Cada destino nomeado é acompanhado por uma configuração de opções padrão para esse destino. Definir isso substitui explicitamente o sinalizador "--prod". Aliases: -c. |
7 | --crossOrigin = none | anonymous | use-credentials | Defina a configuração do atributo crossorigin de elementos que fornecem suporte CORS. Padrão: nenhum. |
8 | --deleteOutputPath = true | false | Exclua o caminho de saída antes de construir. Padrão: verdadeiro. |
9 | --deployUrl = deployUrl | URL onde os arquivos serão implantados. |
10 | --experimentalRollupPass = true | false | Concatene os módulos com Rollup antes de empacotá-los com o Webpack. Padrão: falso. |
11 | --extractCss = true | false | Extraia css de estilos globais em arquivos css em vez de js. Padrão: falso. |
12 | --extractLicenses = true | false | Extraia todas as licenças em um arquivo separado. Padrão: falso. |
13 | --forkTypeChecker = true | false | Execute o verificador de tipo TypeScript em um processo bifurcado. Padrão: verdadeiro. |
14 | --help = true | false | json | JSON | Mostra uma mensagem de ajuda para este comando no console. Padrão: falso. |
15 | --i18nMissingTranslation = aviso | erro | ignorar | Como lidar com traduções ausentes para i18n. Padrão: aviso. |
16 | --index = index | Configura a geração do índice HTML do aplicativo. |
17 | --localize = true | false | |
18 | --main = main | O caminho completo para o ponto de entrada principal do aplicativo, em relação ao espaço de trabalho atual. |
19 | --namedChunks = true | false | Use o nome do arquivo para blocos carregados lentamente. Padrão: verdadeiro. |
20 | --ngswConfigPath = ngswConfigPath | Caminho para ngsw-config.json. |
21 | --optimization = true | false | Ativa a otimização da saída de construção. |
22 | --outputHashing = none | all | media | bundles | Defina o modo de hash de impedimento de cache do nome de arquivo de saída. Padrão: nenhum. |
23 | --outputPath = outputPath | O caminho completo para o novo diretório de saída, relativo ao espaço de trabalho atual. Por padrão, grava a saída em uma pasta chamada dist / no projeto atual. |
24 | --votação | Habilite e defina o período de tempo de pesquisa de monitoramento de arquivo em milissegundos. |
25 | --polyfills = polyfills | O caminho completo para o arquivo polyfills, relativo ao espaço de trabalho atual. |
26 | --preserveSymlinks = true | false | Não use o caminho real ao resolver módulos. Padrão: falso. |
27 | --prod = true | false | Abreviação de "--configuration = production". Quando verdadeiro, define a configuração de construção para o destino de produção. Por padrão, o destino de produção é definido na configuração do espaço de trabalho de forma que todas as compilações façam uso de empacotamento, agitação limitada de árvore e também eliminação limitada de código morto. |
28 | --progress = true | false | Registre o progresso no console durante a construção. Padrão: verdadeiro. |
27 | --resourcesOutputPath = resourcesOutputPath | O caminho onde os recursos de estilo serão colocados, em relação a outputPath. |
28 | --serviceWorker = true | false | Gera uma configuração de service worker para compilações de produção. Padrão: falso. |
29 | --showCircularDependencies = true | false | Mostra avisos de dependência circular em compilações. Padrão: verdadeiro. |
30 | --sourceMap = true | false | Mapas de origem de saída. Padrão: verdadeiro. |
31 | --statsJson = true | false | Gera um arquivo 'stats.json' que pode ser analisado usando ferramentas como 'webpack-bundle-analyser'. Padrão: falso. |
32 | --subresourceIntegrity = true | false | Ativa o uso de validação de integridade de sub-recursos. Padrão: falso. |
33 | --tsConfig = tsConfig | O caminho completo para o arquivo de configuração TypeScript, relativo ao espaço de trabalho atual. |
34 | --vendorChunk = true | false | Use um pacote separado contendo apenas bibliotecas de fornecedores. Padrão: verdadeiro. |
35 | --verbose = true | false | Adiciona mais detalhes ao registro de saída. Padrão: verdadeiro. |
36 | --watch = true | false | Execute o build quando os arquivos forem alterados. Padrão: falso. |
37 | --webWorkerTsConfig = webWorkerTsConfig | Configuração de TypeScript para módulos Web Worker. |
Primeiro mova para um projeto angular atualizado usando o comando ng generate . Substitua o conteúdo de app.component.html pelo conteúdo a seguir e execute o comando.
<app-goals></app-goals>
<router-outlet></router-outlet>
Exemplo
\>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: 210494ms
Aqui, o comando build construiu nosso projeto TutorialsPoint com sucesso.