Skip to content

Commit e15433e

Browse files
authored
refactor(build): consolidate build options (#4105)
Fix #4138 BREAKING CHANGE: - `--extractCss` defaults to `false` on all `--dev` (`ng build` with no flags uses `--dev`) - `--aot` defaults to true in `--prod` - the alias for `--output-path` is now `-op` instead of `-o`
1 parent 092e673 commit e15433e

36 files changed

+435
-417
lines changed

docs/documentation/build.md

+14-6
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,8 @@ All builds make use of bundling, and using the `--prod` flag in `ng build --pro
6565
or `ng serve --prod` will also make use of uglifying and tree-shaking functionality.
6666

6767
## Options
68+
`--watch` (`-w`) flag to run builds when files change
69+
6870
`--target` (`-t`) define the build target
6971

7072
`--environment` (`-e`) defines the build environment
@@ -73,16 +75,22 @@ or `ng serve --prod` will also make use of uglifying and tree-shaking functional
7375

7476
`--dev` flag to set build target and environment to development
7577

76-
`--output-path` (`-o`) path where output will be placed
78+
`--output-path` (`-po`) path where output will be placed
7779

78-
`--output-hashing` define the output filename cache-busting hashing mode
80+
`--aot` flag whether to build using Ahead of Time compilation
7981

80-
`--watch` (`-w`) flag to run builds when files change
82+
`--sourcemap` (`-sm`) output sourcemaps
8183

82-
`--surpress-sizes` flag to suppress sizes from build output
84+
`--vendor-chunk` (`-vb`) use a separate bundle containing only vendor libraries
8385

8486
`--base-href` (`-bh`) base url for the application being built
8587

86-
`--aot` flag whether to build using Ahead of Time compilation
88+
`--deploy-url` (`-d`) url where files will be deployed
89+
90+
`--verbose` (`-v`) adds more details to output logging
91+
92+
`--progress` (`-pr`) log progress to the console while building
8793

88-
`--extract-css` extract css from global styles onto css files instead of js ones
94+
`--extract-css` (`-ec`) extract css from global styles onto css files instead of js ones
95+
96+
`--output-hashing` define the output filename cache-busting hashing mode

docs/documentation/serve.md

+31-11
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,9 @@
88
## Options
99
`--port` (`-p`) port to serve the application on
1010

11-
`--host` (`-H`)
11+
`--host` (`-H`) host where to listen
1212

13-
`--proxy-config` (`-pc`)
14-
15-
`--watcher` (`-w`) provide a new watcher
13+
`--proxy-config` (`-pc`) proxy configuration file
1614

1715
`--live-reload` (`-lr`) flag to turn off live reloading
1816

@@ -24,18 +22,40 @@
2422

2523
`--live-reload-live-css` flag to live reload CSS
2624

27-
`--target` (`-t`, `-dev`, `-prod`) target environment
28-
29-
`--environment` (`-e`) build environment
30-
3125
`--ssl` flag to turn on SSL
3226

3327
`--ssl-key` path to the SSL key
3428

3529
`--ssl-cert` path to the SSL cert
3630

37-
`--aot` flag to turn on Ahead of Time compilation
38-
3931
`--open` (`-o`) opens the app in the default browser
4032

41-
`--extract-css` extract css from global styles onto css files instead of js ones
33+
`--hmr` use hot module reload
34+
35+
`--target` (`-t`) define the build target
36+
37+
`--environment` (`-e`) defines the build environment
38+
39+
`--prod` flag to set build target and environment to production
40+
41+
`--dev` flag to set build target and environment to development
42+
43+
`--output-path` (`-po`) path where output will be placed
44+
45+
`--aot` flag whether to build using Ahead of Time compilation
46+
47+
`--sourcemap` (`-sm`) output sourcemaps
48+
49+
`--vendor-chunk` (`-vb`) use a separate bundle containing only vendor libraries
50+
51+
`--base-href` (`-bh`) base url for the application being built
52+
53+
`--deploy-url` (`-d`) url where files will be deployed
54+
55+
`--verbose` (`-v`) adds more details to output logging
56+
57+
`--progress` (`-pr`) log progress to the console while building
58+
59+
`--extract-css` (`-ec`) extract css from global styles onto css files instead of js ones
60+
61+
`--output-hashing` define the output filename cache-busting hashing mode

packages/angular-cli/commands/build.run.ts

+4-34
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,16 @@
11
import { Version } from '../upgrade/version';
2-
import WebpackBuild from '../tasks/build-webpack';
3-
import { BuildOptions } from './build';
4-
5-
export default function buildRun(commandOptions: BuildOptions) {
6-
if (commandOptions.environment === '') {
7-
if (commandOptions.target === 'development') {
8-
commandOptions.environment = 'dev';
9-
}
10-
if (commandOptions.target === 'production') {
11-
commandOptions.environment = 'prod';
12-
}
13-
}
14-
15-
if (!commandOptions.outputHashing) {
16-
if (commandOptions.target === 'development') {
17-
commandOptions.outputHashing = 'none';
18-
}
19-
if (commandOptions.target === 'production') {
20-
commandOptions.outputHashing = 'all';
21-
}
22-
}
23-
24-
if (typeof commandOptions.sourcemap === 'undefined') {
25-
if (commandOptions.target == 'development') {
26-
commandOptions.sourcemap = true;
27-
}
28-
if (commandOptions.target == 'production') {
29-
commandOptions.sourcemap = false;
30-
}
31-
}
2+
import Build from '../tasks/build';
3+
import { BuildTaskOptions } from './build';
324

5+
export default function buildRun(commandOptions: BuildTaskOptions) {
336
const project = this.project;
347

358
// Check angular version.
369
Version.assertAngularVersionIs2_3_1OrHigher(project.root);
3710

38-
const buildTask = new WebpackBuild({
11+
const buildTask = new Build({
3912
cliProject: project,
4013
ui: this.ui,
41-
outputPath: commandOptions.outputPath,
42-
target: commandOptions.target,
43-
environment: commandOptions.environment,
4414
});
4515

4616
return buildTask.run(commandOptions);

packages/angular-cli/commands/build.ts

+37-49
Original file line numberDiff line numberDiff line change
@@ -1,63 +1,51 @@
1+
import { BuildOptions } from '../models/webpack-config';
2+
13
const Command = require('../ember-cli/lib/models/command');
24

3-
export interface BuildOptions {
4-
target?: string;
5-
environment?: string;
6-
outputPath?: string;
5+
// defaults for BuildOptions
6+
export const BaseBuildCommandOptions: any = [
7+
{
8+
name: 'target',
9+
type: String,
10+
default: 'development',
11+
aliases: ['t', { 'dev': 'development' }, { 'prod': 'production' }]
12+
},
13+
{ name: 'environment', type: String, aliases: ['e'] },
14+
{ name: 'output-path', type: 'Path', aliases: ['op'] },
15+
{ name: 'aot', type: Boolean, default: false },
16+
{ name: 'sourcemap', type: Boolean, aliases: ['sm'] },
17+
{ name: 'vendor-chunk', type: Boolean, default: true, aliases: ['vc'] },
18+
{ name: 'base-href', type: String, default: '/', aliases: ['bh'] },
19+
{ name: 'deploy-url', type: String, aliases: ['d'] },
20+
{ name: 'verbose', type: Boolean, default: false, aliases: ['v'] },
21+
{ name: 'progress', type: Boolean, default: true, aliases: ['pr'] },
22+
{ name: 'i18n-file', type: String },
23+
{ name: 'i18n-format', type: String },
24+
{ name: 'locale', type: String },
25+
{ name: 'extract-css', type: Boolean, aliases: ['ec']},
26+
{
27+
name: 'output-hashing',
28+
type: String,
29+
values: ['none', 'all', 'media', 'bundles'],
30+
description: 'define the output filename cache-busting hashing mode',
31+
aliases: ['oh']
32+
},
33+
];
34+
35+
export interface BuildTaskOptions extends BuildOptions {
736
watch?: boolean;
8-
watcher?: string;
9-
supressSizes: boolean;
10-
baseHref?: string;
11-
aot?: boolean;
12-
sourcemap?: boolean;
13-
vendorChunk?: boolean;
14-
verbose?: boolean;
15-
progress?: boolean;
16-
i18nFile?: string;
17-
i18nFormat?: string;
18-
locale?: string;
19-
deployUrl?: string;
20-
outputHashing?: string;
21-
extractCss?: boolean | null;
2237
}
2338

2439
const BuildCommand = Command.extend({
2540
name: 'build',
2641
description: 'Builds your app and places it into the output path (dist/ by default).',
2742
aliases: ['b'],
2843

29-
availableOptions: [
30-
{
31-
name: 'target',
32-
type: String,
33-
default: 'development',
34-
aliases: ['t', { 'dev': 'development' }, { 'prod': 'production' }]
35-
},
36-
{ name: 'environment', type: String, default: '', aliases: ['e'] },
37-
{ name: 'output-path', type: 'Path', default: null, aliases: ['o'] },
38-
{ name: 'watch', type: Boolean, default: false, aliases: ['w'] },
39-
{ name: 'watcher', type: String },
40-
{ name: 'suppress-sizes', type: Boolean, default: false },
41-
{ name: 'base-href', type: String, default: null, aliases: ['bh'] },
42-
{ name: 'aot', type: Boolean, default: false },
43-
{ name: 'sourcemap', type: Boolean, aliases: ['sm'] },
44-
{ name: 'vendor-chunk', type: Boolean, default: true },
45-
{ name: 'verbose', type: Boolean, default: false },
46-
{ name: 'progress', type: Boolean, default: true },
47-
{ name: 'i18n-file', type: String, default: null },
48-
{ name: 'i18n-format', type: String, default: null },
49-
{ name: 'locale', type: String, default: null },
50-
{ name: 'deploy-url', type: String, default: null, aliases: ['d'] },
51-
{
52-
name: 'output-hashing',
53-
type: String,
54-
values: ['none', 'all', 'media', 'bundles'],
55-
description: 'define the output filename cache-busting hashing mode'
56-
},
57-
{ name: 'extract-css', type: Boolean, default: true }
58-
],
44+
availableOptions: BaseBuildCommandOptions.concat([
45+
{ name: 'watch', type: Boolean, default: false, aliases: ['w'] }
46+
]),
5947

60-
run: function (commandOptions: BuildOptions) {
48+
run: function (commandOptions: BuildTaskOptions) {
6149
return require('./build.run').default.call(this, commandOptions);
6250
}
6351
});

packages/angular-cli/commands/github-pages-deploy.run.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import * as chalk from 'chalk';
66
import * as fs from 'fs';
77
import * as fse from 'fs-extra';
88
import * as path from 'path';
9-
import WebpackBuild from '../tasks/build-webpack';
9+
import Build from '../tasks/build';
1010
import CreateGithubRepo from '../tasks/create-github-repo';
1111
import { CliConfig } from '../models/config';
1212
import { GithubPagesDeployOptions } from './github-pages-deploy';
@@ -44,7 +44,7 @@ export default function githubPagesDeployRun(options: GithubPagesDeployOptions,
4444
// declared here so that tests can stub exec
4545
const execPromise = <(cmd: string, options?: any) => Promise<string>>denodeify(exec);
4646

47-
const buildTask = new WebpackBuild({
47+
const buildTask = new Build({
4848
ui: this.ui,
4949
cliProject: this.project,
5050
target: options.target,

packages/angular-cli/commands/serve.run.ts

+3-21
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import * as denodeify from 'denodeify';
22
const assign = require('lodash/assign');
33
const SilentError = require('silent-error');
44
const PortFinder = require('portfinder');
5-
import ServeWebpackTask from '../tasks/serve-webpack';
5+
import ServeTask from '../tasks/serve';
66
import { Version } from '../upgrade/version';
77
import { ServeTaskOptions } from './serve';
88

@@ -11,37 +11,19 @@ PortFinder.basePort = 49152;
1111
const getPort = <any>denodeify(PortFinder.getPort);
1212

1313
export default function serveRun(commandOptions: ServeTaskOptions) {
14-
if (commandOptions.environment === '') {
15-
if (commandOptions.target === 'development') {
16-
commandOptions.environment = 'dev';
17-
}
18-
if (commandOptions.target === 'production') {
19-
commandOptions.environment = 'prod';
20-
}
21-
}
22-
23-
// default to extractCss to true on prod target
24-
if (typeof commandOptions.extractCss === 'undefined') {
25-
commandOptions.extractCss = commandOptions.target === 'production';
26-
}
27-
2814
// Check angular version.
2915
Version.assertAngularVersionIs2_3_1OrHigher(this.project.root);
3016
commandOptions.liveReloadHost = commandOptions.liveReloadHost || commandOptions.host;
3117

3218
return checkExpressPort(commandOptions)
3319
.then(() => autoFindLiveReloadPort(commandOptions))
3420
.then((opts: ServeTaskOptions) => {
35-
commandOptions = assign({}, opts, {
36-
baseURL: this.project.config(commandOptions.target).baseURL || '/'
37-
});
38-
39-
const serve = new ServeWebpackTask({
21+
const serve = new ServeTask({
4022
ui: this.ui,
4123
project: this.project,
4224
});
4325

44-
return serve.run(commandOptions);
26+
return serve.run(opts);
4527
});
4628
}
4729

0 commit comments

Comments
 (0)