NextJS开发过程中，应用了MateriaUI进行博客网站搭建，对Markdown的语法插件markdown-to-jsx理解不多，并且想要高亮代码块的显示成果。

应用到的组件

npm install --save react-markdown react-syntax-highlighter

1.react-markdown：markdown解析展现组件
2.react-syntax-highlighter：高亮款式组件

应用形式（组件化）

import React from 'react';import ReactMarkdown from 'react-markdown';import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter'import {tomorrow } from 'react-syntax-highlighter/dist/cjs/styles/prism';const renderers = {  code: ({language, value}) => {    return <SyntaxHighlighter style={tomorrow} language={language} children={value} />  },}export default function Markdown(props) {  return <ReactMarkdown renderers={renderers} options={options} {...props} />;}
呈现的问题
  1. react-syntax-highlighter报错Unexpected token export
解决形式：款式门路esm改cjs 【相干ISSUE】

内容原创，未经自己批准禁止转载