File size: 1,759 Bytes
1b72d7e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
import '@/styles/animate.css' // @see https://animate.style/
import '@/styles/globals.css'
import '@/styles/nprogress.css'
import '@/styles/utility-patterns.css'
// core styles shared by all of react-notion-x (required)
import 'react-notion-x/src/styles.css'
import '@/styles/notion.css' // 重写部分样式
import 'aos/dist/aos.css' // You can also use <link> for styles
import { GlobalContextProvider } from '@/lib/global'
import { getGlobalLayoutByTheme } from '@/themes/theme'
import { useRouter } from 'next/router'
import { useCallback, useMemo } from 'react'
import { getQueryParam } from '../lib/utils'
import useAdjustStyle from '@/hooks/useAdjustStyle'
// 各种扩展插件 这个要阻塞引入
import ExternalPlugins from '@/components/ExternalPlugins'
import GlobalHead from '@/components/GlobalHead'
import BLOG from '@/blog.config'
/**
* App挂载DOM 入口文件
* @param {*} param0
* @returns
*/
const MyApp = ({ Component, pageProps }) => {
// 一些可能出现 bug 的样式，可以统一放入该钩子进行调整
useAdjustStyle();
const route = useRouter()
const queryParam = useMemo(() => {
return getQueryParam(route.asPath, 'theme') || pageProps?.NOTION_CONFIG?.THEME || BLOG.THEME
}, [route])
// 整体布局
const GLayout = useCallback(
props => {
// 根据页面路径加载不同Layout文件
const Layout = getGlobalLayoutByTheme(queryParam)
return <Layout {...props} />
},
[queryParam]
)
return (
<GlobalContextProvider {...pageProps}>
<GLayout {...pageProps}>
<GlobalHead {...pageProps}/>
<Component {...pageProps} />
</GLayout>
<ExternalPlugins {...pageProps} />
</GlobalContextProvider>
)
}
export default MyApp
|