diff --git a/lib/core/components/Markdown/anchors.js b/lib/core/components/Markdown/anchors.js
index ab0eb2a2bc..394864b331 100644
--- a/lib/core/components/Markdown/anchors.js
+++ b/lib/core/components/Markdown/anchors.js
@@ -1,4 +1,4 @@
-import toSlug from './toSlug.js';
+import toSlug from './toSlug';
 
 function anchors(md) {
   const originalRender = md.renderer.rules.heading_open;
diff --git a/lib/load/routes.js b/lib/load/routes.js
index fdc8af9b06..908baa2d73 100644
--- a/lib/load/routes.js
+++ b/lib/load/routes.js
@@ -1,21 +1,23 @@
-const path = require('path');
 const {fileToComponentName} = require('./utils');
 
-async function genRoutesConfig({docsData, docsDir, pagesData}) {
+async function genRoutesConfig({docsData, pagesData}) {
   function genDocsRoute({path: docsPath, source}) {
     const componentName = fileToComponentName(source);
     return `
   {
     path: ${JSON.stringify(docsPath)},
     exact: true,
-    component: () => <Docs><${componentName} /></Docs>
+    component: () => (
+      <Docs>
+        <${componentName} />
+      </Docs>
+    )
   }`;
   }
 
   function genDocsImport({source}) {
-    const filePath = path.resolve(docsDir, source);
     const componentName = fileToComponentName(source);
-    return `import ${componentName} from ${JSON.stringify(filePath)}`;
+    return `import ${componentName} from '@docs/${source}';`;
   }
 
   function genPagesRoute({path: pagesPath, source}) {
@@ -30,7 +32,7 @@ async function genRoutesConfig({docsData, docsDir, pagesData}) {
 
   function genPagesImport({source}) {
     const componentName = fileToComponentName(source);
-    return `import ${componentName} from '@pages/${source}'`;
+    return `import ${componentName} from '@pages/${source}';`;
   }
 
   const notFoundRoute = `,
diff --git a/lib/webpack/base.js b/lib/webpack/base.js
index e537417a4f..97e99c2746 100644
--- a/lib/webpack/base.js
+++ b/lib/webpack/base.js
@@ -4,7 +4,15 @@ const path = require('path');
 const mdLoader = require.resolve('./loader/markdown');
 
 module.exports = function createBaseConfig(props) {
-  const {siteConfig, outDir, themePath, siteDir, baseUrl} = props;
+  const {
+    siteConfig,
+    outDir,
+    themePath,
+    docsDir,
+    pagesDir,
+    siteDir,
+    baseUrl
+  } = props;
 
   const config = new Config();
   const isProd = process.env.NODE_ENV === 'production';
@@ -23,7 +31,8 @@ module.exports = function createBaseConfig(props) {
     .set('symlinks', true)
     .alias.set('@theme', themePath)
     .set('@site', siteDir)
-    .set('@pages', path.resolve(siteDir, 'pages'))
+    .set('@docs', docsDir)
+    .set('@pages', pagesDir)
     .set('@generated', path.resolve(__dirname, '../core/generated'))
     .set('@core', path.resolve(__dirname, '../core'))
     .end();