import '../style.css' ; import 'dayjs/locale/ja' ; import '@fortawesome/fontawesome-svg-core/styles.css' ; import dayjs from 'dayjs' ; import localizedFormat from 'dayjs/plugin/localizedFormat' ; import minMax from 'dayjs/plugin/minMax' ; import relativeTime from 'dayjs/plugin/relativeTime' ; import type { AppProps } from 'next/app' ; import { useRouter } from 'next/router' ; import { Fragment , useCallback , useEffect } from 'react' ; dayjs . locale ( 'ja' ) ; dayjs . extend ( localizedFormat ) ; dayjs . extend ( relativeTime ) ; dayjs . extend ( minMax ) ; const useGtag = ( ) : void => { const router = useRouter ( ) ; const handleRouteChange = useCallback ( ( url ) : void => { if ( process . env . GA_MEASUREMENT_ID == null ) return ; gtag ( 'config' , process . env . GA_MEASUREMENT_ID , { page_path : new URL ( url ) . pathname , } ) ; } , [ ] ) ; useEffect ( ( ) => { router . events . on ( 'routeChangeComplete' , handleRouteChange ) ; return ( ) : void => { router . events . off ( 'routeChangeComplete' , handleRouteChange ) ; } ; } , [ router . events , handleRouteChange ] ) ; } ; const App = ( props ) : JSX . Element => { const { Component , pageProps } = props ; useGtag ( ) ; const Layout = ( Component as any ) . Layout ?? Fragment ; return ( < Layout > < Component { ... pageProps } / > < /Layout>); } ; export default App ;