私は NextJs ブログを作成しており、動的ページでマークダウンをレンダリングする必要があります。アプリで CSSReset を使用しているため、マークダウンが正しく表示されません。誰かがこれについて私を助けることができますか??
私のテーマコンテナ
0 import React from "react";
1
2 import {
3 ThemeProvider as ChakraThemeProvider,
4 ColorModeProvider,
5 CSSReset,
6 } from "@chakra-ui/core";
7
8 import { ThemeProvider as EmotionThemeProvider } from "emotion-theming";
9 import theme from "../styles/theme";
10
11 export const ThemeContainer = ({ children }) => {
12 return (
13 <ChakraThemeProvider theme={theme}>
14 <ColorModeProvider value={"light"}>
15 <EmotionThemeProvider theme={theme}>
16 <CSSReset />
17 {children}
18 </EmotionThemeProvider>
19 </ColorModeProvider>
20 </ChakraThemeProvider>
21 );
22 };
私のマークダウンファイル
10 const Post = (postData: Post) => {
+ 11 const content = hydrate(postData.source);
+ 12
+ 13 console.log(content);
_ 14
15 return (
~ 16 <Flex w="full" overflowY="hidden">
~ 17 <div>{content}</div>
~ 18 </Flex>
19 );
20 };
21
22 export default Post;
私が抱えているこの問題を解決する方法を知りたいので、スタイリングを行っていないので、コンテンツをレンダリングする小さなコンポーネントだけを残しました
この CSSReset をフォークして、それを実現しているスタイルを削除する必要がありますか??