diff --git a/package.json b/package.json
index eddc99c4503..061ff8a89f6 100644
--- a/package.json
+++ b/package.json
@@ -124,6 +124,7 @@
     "scheduler": "^0.15.0",
     "semver-regex": "^2.0.0",
     "staged-git-files": "^1.1.2",
+    "sw-precache-webpack-plugin": "^1.0.0",
     "ts-import-plugin": "1.6.1",
     "ts-jest": "^24.0.2",
     "ts-node": "^8.3.0",
diff --git a/scripts/doc-renderer.js b/scripts/doc-renderer.js
index fb341ba53e6..cd0b8cb3914 100644
--- a/scripts/doc-renderer.js
+++ b/scripts/doc-renderer.js
@@ -1,6 +1,10 @@
 import React from 'react'
 import SiteRenderer from 'react-site-renderer'
 
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.register('/service-worker.js')
+}
+
 export default ({ docs }) => {
   return (
     <SiteRenderer
diff --git a/scripts/docs.js b/scripts/docs.js
index 2df5fc7be55..00bd6a6a20c 100644
--- a/scripts/docs.js
+++ b/scripts/docs.js
@@ -2,6 +2,7 @@ const path = require('path')
 const fs = require('fs-extra')
 const { command } = require('doc-scripts')
 const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin')
+const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin')
 const HEAD_HTML = `
 <script>
 window.codeSandBoxDependencies = {
@@ -100,6 +101,20 @@ const createDocs = async () => {
           configFile: path.resolve(__dirname, '../tsconfig.json')
         })
       ]
+      if(env === 'production'){
+        webpackConfig.plugins.push(
+          new SWPrecacheWebpackPlugin(
+            {
+              cacheId: 'formily-doc-site',
+              dontCacheBustUrlsMatching: /\.\w{8}\./,
+              filename: 'service-worker.js',
+              minify: true,
+              navigateFallback: 'https://formilyjs.org/index.html',
+              staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/],
+            }
+          ) 
+        )
+      }
       return webpackConfig
     }
   )