diff --git a/modules/angular2/src/services/url_resolver.dart b/modules/angular2/src/services/url_resolver.dart
index cc692332e2..d1ee1de92d 100644
--- a/modules/angular2/src/services/url_resolver.dart
+++ b/modules/angular2/src/services/url_resolver.dart
@@ -1,9 +1,15 @@
 library angular2.src.services.url_resolver;
 
 import 'package:angular2/di.dart' show Injectable;
+import 'package:angular2/src/services/app_root_url.dart' show AppRootUrl;
 
 @Injectable()
 class UrlResolver {
+
+  final AppRootUrl _appRootUrl;
+
+  UrlResolver(this._appRootUrl);
+
   /**
    * Resolves the `url` given the `baseUrl`:
    * - when the `url` is null, the `baseUrl` is returned,
@@ -20,7 +26,8 @@ class UrlResolver {
     Uri uri = Uri.parse(url);
 
     if (uri.scheme == 'package') {
-      return '/packages/${uri.path}';
+      var maybeSlash = _appRootUrl.value.endsWith('/') ? '' : '/';
+      return '${_appRootUrl.value}${maybeSlash}packages/${uri.path}';
     }
 
     if (uri.isAbsolute) return uri.toString();
diff --git a/modules/angular2/src/services/url_resolver.ts b/modules/angular2/src/services/url_resolver.ts
index aa515e9f56..725fd99ab1 100644
--- a/modules/angular2/src/services/url_resolver.ts
+++ b/modules/angular2/src/services/url_resolver.ts
@@ -7,6 +7,7 @@ import {
   normalizeBlank
 } from 'angular2/src/facade/lang';
 import {ListWrapper} from 'angular2/src/facade/collection';
+import {AppRootUrl} from 'angular2/src/services/app_root_url';
 
 /**
  * Used by the {@link Compiler} when resolving HTML and CSS template URLs.
@@ -17,6 +18,8 @@ import {ListWrapper} from 'angular2/src/facade/collection';
  */
 @Injectable()
 export class UrlResolver {
+  constructor(_: AppRootUrl) {}
+
   /**
    * Resolves the `url` given the `baseUrl`:
    * - when the `url` is null, the `baseUrl` is returned,
diff --git a/modules/angular2/src/transform/template_compiler/generator.dart b/modules/angular2/src/transform/template_compiler/generator.dart
index 07edd8596f..125ec76622 100644
--- a/modules/angular2/src/transform/template_compiler/generator.dart
+++ b/modules/angular2/src/transform/template_compiler/generator.dart
@@ -12,6 +12,7 @@ import 'package:angular2/src/render/dom/compiler/style_url_resolver.dart';
 import 'package:angular2/src/render/dom/compiler/view_loader.dart';
 import 'package:angular2/src/render/xhr.dart' show XHR;
 import 'package:angular2/src/reflection/reflection.dart';
+import 'package:angular2/src/services/app_root_url.dart';
 import 'package:angular2/src/services/url_resolver.dart';
 import 'package:angular2/src/transform/common/asset_reader.dart';
 import 'package:angular2/src/transform/common/xhr_impl.dart';
@@ -85,7 +86,7 @@ class _TemplateExtractor {
 
   _TemplateExtractor(XHR xhr)
       : _factory = new CompileStepFactory(new ng.Parser(new ng.Lexer())) {
-    var urlResolver = new UrlResolver();
+    var urlResolver = new UrlResolver(new AppRootUrl(''));
     var styleUrlResolver = new StyleUrlResolver(urlResolver);
     var styleInliner = new StyleInliner(xhr, styleUrlResolver, urlResolver);
 
diff --git a/modules/angular2/test/core/compiler/compiler_spec.ts b/modules/angular2/test/core/compiler/compiler_spec.ts
index a69cfaaf57..724117f75c 100644
--- a/modules/angular2/test/core/compiler/compiler_spec.ts
+++ b/modules/angular2/test/core/compiler/compiler_spec.ts
@@ -48,7 +48,7 @@ export function main() {
     function createCompiler(renderCompileResults:
                                 List<renderApi.ProtoViewDto | Promise<renderApi.ProtoViewDto>>,
                             protoViewFactoryResults: List<AppProtoView>) {
-      var urlResolver = new UrlResolver();
+      var urlResolver = new UrlResolver(new AppRootUrl(""));
       renderCompileRequests = [];
       renderCompileResults = ListWrapper.clone(renderCompileResults);
       renderCompiler.spy('compile').andCallFake((view) => {
@@ -399,9 +399,9 @@ export function main() {
          var reader: any = new SpyDirectiveResolver();
 
          // create the compiler
-         var compiler =
-             new Compiler(reader, cache, tplResolver, cmpUrlMapper, new UrlResolver(),
-                          renderCompiler, protoViewFactory, new AppRootUrl("http://www.app.com"));
+         var compiler = new Compiler(reader, cache, tplResolver, cmpUrlMapper,
+                                     new UrlResolver(new AppRootUrl("")), renderCompiler,
+                                     protoViewFactory, new AppRootUrl("http://www.app.com"));
          compiler.compileInHost(MainComponent)
              .then((protoViewRef) => {
                // the test should have failed if the resolver was called, so we're good
@@ -718,4 +718,4 @@ function collectEmbeddedPvs(pv: AppProtoView, target: AppProtoView[] = null): Ap
     }
   });
   return target;
-}
\ No newline at end of file
+}
diff --git a/modules/angular2/test/render/dom/compiler/style_url_resolver_spec.ts b/modules/angular2/test/render/dom/compiler/style_url_resolver_spec.ts
index 1bfcdd5d61..d9d3707b3f 100644
--- a/modules/angular2/test/render/dom/compiler/style_url_resolver_spec.ts
+++ b/modules/angular2/test/render/dom/compiler/style_url_resolver_spec.ts
@@ -2,12 +2,14 @@ import {describe, it, expect, beforeEach, ddescribe, iit, xit, el} from 'angular
 import {StyleUrlResolver} from 'angular2/src/render/dom/compiler/style_url_resolver';
 
 import {UrlResolver} from 'angular2/src/services/url_resolver';
+import {AppRootUrl} from 'angular2/src/services/app_root_url';
 
 export function main() {
   describe('StyleUrlResolver', () => {
     let styleUrlResolver;
 
-    beforeEach(() => { styleUrlResolver = new StyleUrlResolver(new UrlResolver()); });
+    beforeEach(
+        () => { styleUrlResolver = new StyleUrlResolver(new UrlResolver(new AppRootUrl(""))); });
 
     it('should resolve "url()" urls', () => {
       var css = `
diff --git a/modules/angular2/test/render/dom/compiler/view_loader_spec.ts b/modules/angular2/test/render/dom/compiler/view_loader_spec.ts
index 99e8b07f52..ddb2574f41 100644
--- a/modules/angular2/test/render/dom/compiler/view_loader_spec.ts
+++ b/modules/angular2/test/render/dom/compiler/view_loader_spec.ts
@@ -15,6 +15,7 @@ import {ViewLoader} from 'angular2/src/render/dom/compiler/view_loader';
 import {StyleInliner} from 'angular2/src/render/dom/compiler/style_inliner';
 import {StyleUrlResolver} from 'angular2/src/render/dom/compiler/style_url_resolver';
 import {UrlResolver} from 'angular2/src/services/url_resolver';
+import {AppRootUrl} from 'angular2/src/services/app_root_url';
 
 import {ViewDefinition} from 'angular2/src/render/api';
 import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
@@ -28,7 +29,7 @@ export function main() {
 
     beforeEach(() => {
       xhr = new MockXHR();
-      urlResolver = new UrlResolver();
+      urlResolver = new UrlResolver(new AppRootUrl(''));
       styleUrlResolver = new StyleUrlResolver(urlResolver);
       let styleInliner = new StyleInliner(xhr, styleUrlResolver, urlResolver);
       loader = new ViewLoader(xhr, styleInliner, styleUrlResolver);
diff --git a/modules/angular2/test/services/url_resolver_spec.ts b/modules/angular2/test/services/url_resolver_spec.ts
index 830205a694..4ab6d8b6a7 100644
--- a/modules/angular2/test/services/url_resolver_spec.ts
+++ b/modules/angular2/test/services/url_resolver_spec.ts
@@ -1,9 +1,21 @@
-import {describe, it, expect, beforeEach, ddescribe, iit, xit, el} from 'angular2/test_lib';
+import {
+  describe,
+  it,
+  expect,
+  beforeEach,
+  ddescribe,
+  iit,
+  xit,
+  el,
+  IS_DARTIUM
+} from 'angular2/test_lib';
 import {UrlResolver} from 'angular2/src/services/url_resolver';
+import {AppRootUrl} from 'angular2/src/services/app_root_url';
 
 export function main() {
   describe('UrlResolver', () => {
-    var resolver = new UrlResolver();
+    var appRootUrl = new AppRootUrl('http://localhost/example/');
+    var resolver = new UrlResolver(appRootUrl);
 
     describe('absolute base url', () => {
       it('should add a relative path to the base url', () => {
@@ -70,5 +82,14 @@ export function main() {
         expect(resolver.resolve('foo/baz/', '/bar')).toEqual('/bar');
       });
     });
+
+    if (IS_DARTIUM) {
+      describe('package url', () => {
+        it('should be served relative to AppRootUrl', () => {
+          expect(resolver.resolve('foo', 'package:bar/baz.dart'))
+              .toEqual('http://localhost/example/packages/bar/baz.dart');
+        });
+      });
+    }
   });
 }
diff --git a/modules/benchmarks/src/compiler/compiler_benchmark.ts b/modules/benchmarks/src/compiler/compiler_benchmark.ts
index 542befef5e..745f866910 100644
--- a/modules/benchmarks/src/compiler/compiler_benchmark.ts
+++ b/modules/benchmarks/src/compiler/compiler_benchmark.ts
@@ -35,7 +35,7 @@ export function main() {
   var cache = new CompilerCache();
   var viewResolver = new MultipleViewResolver(
       count, [BenchmarkComponentNoBindings, BenchmarkComponentWithBindings]);
-  var urlResolver = new UrlResolver();
+  var urlResolver = new UrlResolver(new AppRootUrl(""));
   var shadowDomStrategy = new NativeShadowDomStrategy();
   var renderCompiler = new rc.DefaultDomCompiler(new Parser(new Lexer()), shadowDomStrategy,
                                                  new ViewLoader(null, null, null));
diff --git a/modules/examples/src/material/button/index.ts b/modules/examples/src/material/button/index.ts
index 4066a43056..385a8f75d5 100644
--- a/modules/examples/src/material/button/index.ts
+++ b/modules/examples/src/material/button/index.ts
@@ -37,5 +37,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/checkbox/index.ts b/modules/examples/src/material/checkbox/index.ts
index d34a8a4363..ac3c489fbd 100644
--- a/modules/examples/src/material/checkbox/index.ts
+++ b/modules/examples/src/material/checkbox/index.ts
@@ -20,5 +20,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/demo_common.dart b/modules/examples/src/material/demo_common.dart
index 60a86325a2..316002dc04 100644
--- a/modules/examples/src/material/demo_common.dart
+++ b/modules/examples/src/material/demo_common.dart
@@ -2,22 +2,12 @@ library angular2_examples.material.demo_common;
 
 import 'package:angular2/src/dom/browser_adapter.dart';
 import 'package:angular2/src/services/url_resolver.dart';
+import 'package:angular2/src/services/app_root_url.dart';
 
 void commonDemoSetup() {
   BrowserDomAdapter.makeCurrent();
 }
 
 class DemoUrlResolver extends UrlResolver {
-
-  @override
-  String resolve(String baseUrl, String url) {
-    const MATERIAL_PKG = 'package:angular2_material/';
-
-    // We run a proxy server in front of pub serve that prepends "example" to
-    // paths
-    if (url.startsWith(MATERIAL_PKG)) {
-      return '/examples/packages/angular2_material/' + url.substring(MATERIAL_PKG.length);
-    }
-    return super.resolve(baseUrl, url);
-  }
+  DemoUrlResolver(AppRootUrl appRootUrl) : super(appRootUrl);
 }
diff --git a/modules/examples/src/material/demo_common.ts b/modules/examples/src/material/demo_common.ts
index 55ae50943a..a93e9cf7c5 100644
--- a/modules/examples/src/material/demo_common.ts
+++ b/modules/examples/src/material/demo_common.ts
@@ -19,7 +19,7 @@ export function commonDemoSetup(): void {
 @Injectable()
 export class DemoUrlResolver extends UrlResolver {
   constructor() {
-    super();
+    super(null);
   }
 
   resolve(baseUrl: string, url: string): string {
diff --git a/modules/examples/src/material/dialog/index.ts b/modules/examples/src/material/dialog/index.ts
index 2f098324c7..4d044f45b8 100644
--- a/modules/examples/src/material/dialog/index.ts
+++ b/modules/examples/src/material/dialog/index.ts
@@ -92,5 +92,5 @@ class SimpleDialogComponent {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/grid_list/index.ts b/modules/examples/src/material/grid_list/index.ts
index 0d87985d68..dc1d5ae8cd 100644
--- a/modules/examples/src/material/grid_list/index.ts
+++ b/modules/examples/src/material/grid_list/index.ts
@@ -18,5 +18,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/input/index.ts b/modules/examples/src/material/input/index.ts
index 683a5a3605..7784d3cc07 100644
--- a/modules/examples/src/material/input/index.ts
+++ b/modules/examples/src/material/input/index.ts
@@ -12,5 +12,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/progress-linear/index.ts b/modules/examples/src/material/progress-linear/index.ts
index 7c5a08b1d6..8954378606 100644
--- a/modules/examples/src/material/progress-linear/index.ts
+++ b/modules/examples/src/material/progress-linear/index.ts
@@ -20,5 +20,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/radio/index.ts b/modules/examples/src/material/radio/index.ts
index b08b5e76b1..b91a16cb4e 100644
--- a/modules/examples/src/material/radio/index.ts
+++ b/modules/examples/src/material/radio/index.ts
@@ -37,5 +37,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }
diff --git a/modules/examples/src/material/switcher/index.ts b/modules/examples/src/material/switcher/index.ts
index a45395a57f..8c26c45b89 100644
--- a/modules/examples/src/material/switcher/index.ts
+++ b/modules/examples/src/material/switcher/index.ts
@@ -20,5 +20,5 @@ class DemoApp {
 
 export function main() {
   commonDemoSetup();
-  bootstrap(DemoApp, [bind(UrlResolver).toValue(new DemoUrlResolver())]);
+  bootstrap(DemoApp, [bind(UrlResolver).toClass(DemoUrlResolver)]);
 }