工作笔记 (20200220) React-highlight的使用方法

React-Highlight的使用方法

1.在项目中安装

yarn add react-highlight

2.在React项目中导入

import Highlight from ‘react-highlight’

3.选择自己喜欢的主题

在node_modules/highlight.js/styles/你喜欢的样式名
举个🌰：
import “highlight.js/styles/zenburn.css”

4.使用Highlight

在你想使用的位置

<Highlight className="javascript">{`
                var a = "hello world";
                console.log(a);
    `}</Highlight>
这样就会在屏幕上显示高亮的部分

否
附上我成功的图片：

图片里的stripIndent，是一个tag函数。

• 作用是去除，字符串之间的空格的。
• 要使用这个函数得 yarn add common-tags
• 然后 import { stripIndent } from “common-tags”

tag 函数是ES6的新增语法，

• 就是在模版字符串前面放置一个函数，用来控制它如何被转换成字符串。
  感兴趣的小伙伴，点击这里tag相关，简单易懂
  有大神有不同的看法，还请在评论区，赐教。