From 1a677c4a59ade84414c2f8eaee1d48d87aafb779 Mon Sep 17 00:00:00 2001 From: Chang Liu <3dslayer@gmail.com> Date: Mon, 16 Jan 2017 19:56:56 +1100 Subject: [PATCH] fix(build): override publicPath for ExtractTextPlugin and add extract-css test --- .../angular-cli/models/webpack-build-utils.ts | 4 +++- tests/e2e/tests/build/styles/extract-css.ts | 21 +++++++++++++++++++ 2 files changed, 24 insertions(+), 1 deletion(-) create mode 100644 tests/e2e/tests/build/styles/extract-css.ts diff --git a/packages/angular-cli/models/webpack-build-utils.ts b/packages/angular-cli/models/webpack-build-utils.ts index 8ecd7787c17f..51f5cf093ac6 100644 --- a/packages/angular-cli/models/webpack-build-utils.ts +++ b/packages/angular-cli/models/webpack-build-utils.ts @@ -80,7 +80,9 @@ export function makeCssLoaders(stylePaths: string[] = []) { include: stylePaths, test, loaders: ExtractTextPlugin.extract({ remove: false, loader: ['css-loader', ...commonLoaders, ...loaders], - fallbackLoader: 'style-loader' + fallbackLoader: 'style-loader', + // publicPath needed as a workaround https://github.com/angular/angular-cli/issues/4035 + publicPath: '' }) }))); } diff --git a/tests/e2e/tests/build/styles/extract-css.ts b/tests/e2e/tests/build/styles/extract-css.ts new file mode 100644 index 000000000000..92c614999f22 --- /dev/null +++ b/tests/e2e/tests/build/styles/extract-css.ts @@ -0,0 +1,21 @@ +import { writeMultipleFiles, expectFileToMatch } from '../../../utils/fs'; +import { ng } from '../../../utils/process'; +import { stripIndents } from 'common-tags'; + +export default function () { + return writeMultipleFiles({ + 'src/styles.css': stripIndents` + div { background: url("./assets/more.svg"); } + `, + 'src/assets/more.svg': stripIndents` + + + + `}) + .then(() => ng('build', '--extract-css')) + .then(() => expectFileToMatch('dist/styles.bundle.css', + /div\s*{\s*background:\s*url\(more.svg\);\s*}/)) + .then(() => ng('build', '--extract-css', '--deploy-url=client/')) + .then(() => expectFileToMatch('dist/styles.bundle.css', + /div\s*{\s*background:\s*url\(more.svg\);\s*}/)); +}