merged from dev-mayne

config.demo.js

@@ -107,6 +107,12 @@ module.exports = {
     ga: {
         open: false, // 默认关闭
         trackingId: 'UA-xxxxxxxx-x', // ga 分配的追踪代码
+        viewId: 'xxxxxxxxx', // ga 分配的数据视图ID，用于 guess.js 优化访问体验。
+    },
+    // google_ad_client
+    google_ad_client: {
+        open: true,
+        clientId: 'pub-6897108038029263',
     },
     // PWA 优化 
     pwa: {

config.js

@@ -108,6 +108,11 @@ module.exports = {
         open: false, // 默认关闭
         trackingId: 'UA-xxxxxxxx-x', // ga 分配的追踪代码
     },
+    // google_ad_client
+    google_ad_client: {
+        open: false,
+        clientId: 'pub-xxxxxxxxxxxx',
+    },
     // PWA 优化 
     pwa: {
         open: false, //默认关闭

gatsby-browser.js

@@ -8,3 +8,14 @@
 // export const wrapRootElement = ({ element }) => {
 //   return <WithRoot key={Math.random()}>{element}</WithRoot>;
 // };
+
+export const onServiceWorkerUpdateFound = () => {
+    const answer = window.confirm(
+        `好久不见，站点已经更新了。` +
+        `重新加载，展示新页面？`
+    )
+
+    if (answer === true) {
+        window.location.reload()
+    }
+}

gatsby-config.js

@@ -18,6 +18,22 @@ if (config.ga.open) {
             head: true,
         },
     })
+
+    if (config.ga.viewId) {
+        conf.plugins.push({
+            resolve: "gatsby-plugin-guess-js",
+            options: {
+                // Find the view id in the GA admin in a section labeled "views"
+                GAViewID: `${config.ga.viewId}`,
+                minimumThreshold: 0.03,
+                // The "period" for fetching analytic data.
+                period: {
+                    startDate: new Date("2019-1-1"),
+                    endDate: new Date(),
+                },
+            },
+        })
+    }
 }
 
 if (config.sitemap.open) {

netlify.toml

@@ -6,19 +6,24 @@
 [[headers]]
   for = "*.js"
   [headers.values]
-    Cache-Control = "public, max-age=604800"
+    Cache-Control = "public, max-age=31536000,immutable"
+
+[[headers]]
+  for = "/sw.js"
+  [headers.values]
+    Cache-Control = "public, max-age=0, must-revalidate"
 
 [[headers]]
   for = "*.css" 
   [headers.values]
-    Cache-Control = "public, max-age=604800"
+    Cache-Control = "public, max-age=31536000,immutable"
 
 [[headers]]
   for = "*.jpg" 
   [headers.values]
-    Cache-Control = "public, max-age=604800"
+    Cache-Control = "public, max-age=31536000,immutable"
 
 [[headers]]
   for = "*.png" 
   [headers.values]
-    Cache-Control = "public, max-age=604800"
+    Cache-Control = "public, max-age=31536000,immutable"

package.json

@@ -11,26 +11,20 @@
     "axios": "^0.18.1",
     "dayjs": "^1.8.8",
     "disqus-react": "^1.0.5",
-    "gatsby": "latest",
+    "gatsby": "^2.9.0",
     "gatsby-plugin-feed": "^2.0.11",
     "gatsby-plugin-google-analytics": "^2.0.9",
+    "gatsby-plugin-guess-js": "^1.1.0",
     "gatsby-plugin-manifest": "^2.0.13",
     "gatsby-plugin-offline": "^2.0.21",
     "gatsby-plugin-react-helmet": "^3.0.5",
-    "gatsby-plugin-sharp": "^2.0.17",
     "gatsby-plugin-sitemap": "^2.0.4",
-    "gatsby-remark-images": "^3.0.1",
-    "gatsby-remark-prismjs": "^3.2.0",
-    "gatsby-remark-relative-images": "^0.2.1",
-    "gatsby-source-filesystem": "^2.0.12",
-    "gatsby-transformer-csv": "^2.0.6",
-    "gatsby-transformer-remark": "^2.1.19",
     "github-api": "^3.0.0",
     "image-downloader": "^3.4.2",
     "jss": "latest",
-    "loadsh": "^0.0.4",
+    "katex": "^0.10.2",
     "lodash": "^4.17.11",
-    "prismjs": "^1.15.0",
+    "prismjs": "^1.16.0",
     "prop-types": "latest",
     "puppeteer": "^1.17.0",
     "react": "^16.8.6",
@@ -53,4 +47,4 @@
     "netlify-lambda": "^1.4.13",
     "yarn": "^1.16.0"
   }
-}
+}

src/components/bottom.js

@@ -5,7 +5,7 @@ import ULink from './utils/link-without-underline'
 import axios from 'axios'
 import Typography from '@material-ui/core/Typography';
 import config from '../../config'
-import _ from 'loadsh'
+import _ from 'lodash'
 
 function isChineseChar(str) {
     var reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/;

src/components/layout.js

@@ -104,6 +104,19 @@ class Layout extends React.Component {
                         为了更好的浏览体验，请不要在本页面禁用 Javascript 🙂
                     </noscript>
                 </Helmet>
+                {
+                    config.google_ad_client.open && <Helmet>
+                        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
+                        <script>
+                            {
+                                `(adsbygoogle = window.adsbygoogle || []).push({
+                                        google_ad_client: "${config.google_ad_client.clientId}",
+                                        enable_page_level_ads: true
+                                    })`
+                            }
+                        </script>
+                    </Helmet>
+                }
 
                 <SwipeableDrawer
                     disableBackdropTransition={!iOS}

src/components/post/blog-post.js

@@ -3,16 +3,16 @@ import { graphql } from 'gatsby'
 import Layout from '../layout'
 import withRoot from '../../withRoot'
 import Paper from '../utils/paper'
-import 'prismjs/themes/prism-tomorrow.css'
-import 'prismjs/plugins/line-numbers/prism-line-numbers.css'
 import ScrollProgress from '../utils/scroll-progress'
 import ColorfulTag from '../utils/hash-colorful-tag'
 import getImageByName from '../utils/notion-hash-image'
-import Disqus from 'disqus-react';
+import Disqus from 'disqus-react'
 import { Helmet } from "react-helmet"
 import config from '../../../config'
 import notion from '../../notion/api'
-
+import 'prismjs/themes/prism-tomorrow.css'
+import 'prismjs/plugins/line-numbers/prism-line-numbers.css'
+import 'katex/dist/katex.min.css'
 
 class BlogPost extends React.Component {
     constructor(props) {

src/components/search/search.js

@@ -1,10 +1,9 @@
 import React from 'react';
-import Button from '@material-ui/core/Button';
 import TextField from '@material-ui/core/TextField';
 import Dialog from '@material-ui/core/Dialog';
 import DialogContent from '@material-ui/core/DialogContent';
 import Axios from "axios"
-import _ from 'loadsh'
+import _ from 'lodash'
 import SearchResults from './searchResult'
 import InputAdornment from '@material-ui/core/InputAdornment';
 import SearchIcon from '@material-ui/icons/Search';

src/index.css

@@ -5,7 +5,7 @@ body, html {
 
 a {
     text-decoration: none;
-    color: #009688!important;
+    color: #00796b!important;
     overflow-wrap: break-word;
 }
 

src/notion/syncBlog.js

@@ -90,7 +90,7 @@ exports.syncNotionBlogData = async ({ createNode, createNodeId, createContentDig
         let url = config.blog.url
         let res = await notion.queryCollection(url)
 
-        res = res.filter(item => item.status == '已发布')
+        res = res.filter(item => item && item.public_date && item.status == '已发布')
         if (config.blog.openGithubCache) {
             // 开启github 文章缓存
             let allBlogInfo = await GitHub.getAllBlogInfo()