diff --git a/packages/grafana-data/src/types/app.ts b/packages/grafana-data/src/types/app.ts
index 2324eb3c741..cebc1712465 100644
--- a/packages/grafana-data/src/types/app.ts
+++ b/packages/grafana-data/src/types/app.ts
@@ -12,14 +12,27 @@ export enum CoreApp {
 
 export interface AppRootProps<T = KeyValue> {
   meta: AppPluginMeta<T>;
-
-  path: string; // The URL path to this page
-  query: KeyValue; // The URL query parameters
+  /**
+   * base URL segment for an app, /app/pluginId
+   */
+  basename: string; // The URL path to this page
 
   /**
    * Pass the nav model to the container... is there a better way?
    */
   onNavChanged: (nav: NavModel) => void;
+
+  /**
+   * The URL query parameters
+   * @deprecated Use react-router instead
+   */
+  query: KeyValue;
+
+  /**
+   * The URL path to this page
+   * @deprecated Use react-router instead
+   */
+  path: string;
 }
 
 export interface AppPluginMeta<T = KeyValue> extends PluginMeta<T> {
diff --git a/packages/grafana-toolkit/src/config/webpack.plugin.config.ts b/packages/grafana-toolkit/src/config/webpack.plugin.config.ts
index 2458c59f8b5..19c3ae9ceb6 100644
--- a/packages/grafana-toolkit/src/config/webpack.plugin.config.ts
+++ b/packages/grafana-toolkit/src/config/webpack.plugin.config.ts
@@ -185,6 +185,7 @@ const getBaseWebpackConfig: WebpackConfigurationGetter = async (options) => {
       'react-redux',
       'redux',
       'rxjs',
+      'react-router-dom',
       'd3',
       'angular',
       '@grafana/ui',
diff --git a/public/app/AppWrapper.tsx b/public/app/AppWrapper.tsx
index 821d4b48949..182c0e4c99e 100644
--- a/public/app/AppWrapper.tsx
+++ b/public/app/AppWrapper.tsx
@@ -59,7 +59,7 @@ export class AppWrapper extends React.Component<AppWrapperProps, AppWrapperState
 
     return (
       <Route
-        exact
+        exact={route.exact === undefined ? true : route.exact}
         path={route.path}
         key={route.path}
         render={(props) => {
diff --git a/public/app/core/navigation/types.ts b/public/app/core/navigation/types.ts
index 61902e65a12..a88d082a297 100644
--- a/public/app/core/navigation/types.ts
+++ b/public/app/core/navigation/types.ts
@@ -16,4 +16,5 @@ export interface RouteDescriptor {
   pageClass?: string;
   /** Can be used like an id for the route if the same component is used by many routes */
   routeName?: string;
+  exact?: boolean;
 }
diff --git a/public/app/features/plugins/AppRootPage.tsx b/public/app/features/plugins/AppRootPage.tsx
index fa22100c574..be381da635f 100644
--- a/public/app/features/plugins/AppRootPage.tsx
+++ b/public/app/features/plugins/AppRootPage.tsx
@@ -1,6 +1,6 @@
 // Libraries
 import React, { Component } from 'react';
-import { AppEvents, AppPlugin, AppPluginMeta, NavModel, PluginType } from '@grafana/data';
+import { AppEvents, AppPlugin, AppPluginMeta, KeyValue, NavModel, PluginType } from '@grafana/data';
 import { createHtmlPortalNode, InPortal, OutPortal, HtmlPortalNode } from 'react-reverse-portal';
 
 import Page from 'app/core/components/Page/Page';
@@ -10,6 +10,7 @@ import { getNotFoundNav, getWarningNav, getExceptionNav } from 'app/core/nav_mod
 import { appEvents } from 'app/core/core';
 import PageLoader from 'app/core/components/PageLoader/PageLoader';
 import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
+import { locationSearchToObject } from '@grafana/runtime';
 
 interface RouteParams {
   pluginId: string;
@@ -91,7 +92,6 @@ class AppRootPage extends Component<Props, State> {
   };
 
   render() {
-    const { location, queryParams } = this.props;
     const { loading, plugin, nav, portalNode } = this.state;
 
     if (plugin && !plugin.root) {
@@ -105,9 +105,10 @@ class AppRootPage extends Component<Props, State> {
           {plugin && plugin.root && (
             <plugin.root
               meta={plugin.meta}
-              query={queryParams}
-              path={location.pathname}
+              basename={this.props.match.url}
               onNavChanged={this.onNavChanged}
+              query={locationSearchToObject(this.props.location.search) as KeyValue}
+              path={this.props.location.pathname}
             />
           )}
         </InPortal>
diff --git a/public/app/features/plugins/plugin_loader.ts b/public/app/features/plugins/plugin_loader.ts
index 3c4b138e09d..160ca5949d5 100644
--- a/public/app/features/plugins/plugin_loader.ts
+++ b/public/app/features/plugins/plugin_loader.ts
@@ -46,6 +46,8 @@ grafanaUI.DataSourceApi = grafanaData.DataSourceApi;
 // rxjs
 import * as rxjs from 'rxjs';
 import * as rxjsOperators from 'rxjs/operators';
+// routing
+import * as reactRouter from 'react-router-dom';
 
 // add cache busting
 const bust = `?_cache=${Date.now()}`;
@@ -92,6 +94,7 @@ exposeToPlugin('angular', angular);
 exposeToPlugin('d3', d3);
 exposeToPlugin('rxjs', rxjs);
 exposeToPlugin('rxjs/operators', rxjsOperators);
+exposeToPlugin('react-router-dom', reactRouter);
 
 // Experimental modules
 exposeToPlugin('prismjs', prismjs);
diff --git a/public/app/routes/routes.tsx b/public/app/routes/routes.tsx
index eb43a1ae794..c3e246d69c0 100644
--- a/public/app/routes/routes.tsx
+++ b/public/app/routes/routes.tsx
@@ -149,6 +149,7 @@ export function getAppRoutes(): RouteDescriptor[] {
     },
     {
       path: '/a/:pluginId/',
+      exact: false,
       // Someday * and will get a ReactRouter under that path!
       component: SafeDynamicImport(
         () => import(/* webpackChunkName: "AppRootPage" */ 'app/features/plugins/AppRootPage')