fix vars in eject

Author: filipesilva

packages/@angular/cli/models/webpack-configs/styles.ts

@@ -45,6 +45,8 @@ export function getStylesConfig(wco: WebpackConfigOptions) {
   const cssnanoPlugin = cssnano({ safe: true, autoprefixer: false });
 
   // Convert absolute resource URLs to account for base-href and deploy-url.
+  const baseHref = wco.buildOptions.baseHref;
+  const deployUrl = wco.buildOptions.deployUrl;
   const postcssUrlOptions = {
     url: (URL: string) => {
       // Only convert absolute URLs, which CSS-Loader won't process into require().
@@ -53,11 +55,14 @@ export function getStylesConfig(wco: WebpackConfigOptions) {
       }
       // Join together base-href, deploy-url and the original URL.
       // Also dedupe multiple slashes into single ones.
-      return `/${wco.buildOptions.baseHref || ''}/${wco.buildOptions.deployUrl || ''}/${URL}`
-        .replace(/\/\/+/g, '/');
+      return `/${baseHref || ''}/${deployUrl || ''}/${URL}`.replace(/\/\/+/g, '/');
     }
   };
   const urlPlugin = postcssUrl(postcssUrlOptions);
+  // We need to save baseHref and deployUrl for the Ejected webpack config to work (we reuse
+  //  the function defined above).
+  (postcssUrlOptions as any).baseHref = baseHref;
+  (postcssUrlOptions as any).deployUrl = deployUrl;
   // Save the original options as arguments for eject.
   urlPlugin[postcssArgs] = postcssUrlOptions;
 

packages/@angular/cli/tasks/eject.ts

@@ -141,6 +141,8 @@ class JsonWebpackSerializer {
             this.variableImports['postcss-url'] = 'postcssUrl';
             let args = '';
             if (x[postcssArgs] && x[postcssArgs].url) {
+              this.variables['baseHref'] = JSON.stringify(x[postcssArgs].baseHref);
+              this.variables['deployUrl'] = JSON.stringify(x[postcssArgs].deployUrl);
               args = `{"url": ${x[postcssArgs].url.toString()}}`;
             }
             return this._escape(`postcssUrl(${args})`);