Описание тега react-syntax-highlighter

2 ответа

Есть ли простой способ применить настраиваемую тему для выделения синтаксиса реакции?

Я пытался сгенерировать фрагмент кода на своем веб-сайте в визуализированном текстовом редакторе с помощью response-syntax-highlighter. Я потратил некоторое время на использование этого плагина, и он мне нравится, однако я столкнулся с проблемой, на…
0 ответов

Можно ли выделить определенные символы в строке с помощью подсветки синтаксиса реакции?

Я создал следующий компонент React. Он реализует подсветку синтаксиса реакции : import React from "react"; import { PrismAsyncLight as SyntaxHighlighter } from "react-syntax-highlighter"; import { coy } from "react-syntax-highlighter/dist/cjs/styles…
1 ответ

Почему стили из react-syntax-highlighter/dist/esm/styles/prism не работают должным образом?

это мой код import SyntaxHighlighter from "react-syntax-highlighter"; import { vscDarkPlus } from "react-syntax-highlighter/dist/esm/styles/prism"; const App = () => { const x = ` for (let i = 0; i < haystack.length; i++) { if (!haystack[i] ==…
14 апр '21 в 09:33
0 ответов

props lineNumberStyle не меняет цвет

это мой код import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; import { vscDarkPlus } from "react-syntax-highlighter/dist/esm/styles/prism"; const App = () => { const code = `const x =100;`; return ( <SyntaxHighlighter lang…
15 апр '21 в 01:43
1 ответ

Highlight.js не работает с React-Markdown

я использую react-syntax-highlighter@15.4.3для подсветки синтаксиса. Ниже приведен код: import React, { PureComponent } from "react"; import PropTypes from "prop-types"; import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; import {…
0 ответов

Редактор кода / выделитель для React, который выводит SVG или текст с автоматическим изменением размера

Я хочу вывести выделенный код, в котором выделенный текст автоматически масштабируется в зависимости от размеров родительского элемента. Что я могу придумать, есть 3 решения Выполните математические вычисления, посчитайте номера строк и выведите раз…
0 ответов

Как загрузить компонент React в React-Syntax-Highlighter?

Я пытаюсь заставить программу просмотра кода отображать код в файле. Очень похоже на просмотрщик кода в git hub. Как я могу получить содержимое файла компонента реакции в формате, который будет многострочным, и я могу передать его в подсветку синтак…
27 авг '21 в 23:45
0 ответов

Как добавить имя файла или заголовок в Hightligting синтаксиса реакции

Привет, я успешно добавил подсветку синтаксиса реакции в свой проект, который использует gatsbyjs и strapi, из strapi контент был отформатирован в разметке, поэтому я добавил а также для обработки рендеринга и подсветки синтаксиса в моем приложении …
1 ответ

как импортировать файл со специальным символом в имени [дубликат]

Как я могу импортировать файл со специальными символами в его имени в ES6? Я могу import { tomorrow} from 'react-syntax-highlighter/dist/esm/styles/hljs'; но я не могу: import { tomorrow-night} from 'react-syntax-highlighter/dist/esm/styles/hljs';
2 ответа

Как я могу импортировать JS-файл со специальными символами в его имени в React и JSX?

Как я могу импортировать JS-файл со специальными символами в его имени в React и JSX? Я могу import { tomorrow} from 'react-syntax-highlighter/dist/esm/styles/hljs'; (в папке находятся завтра.js и tomrorrow-night.js) но я не могу: import { tomorrow-…
1 ответ

Использование подсветки синтаксиса с tsx react markdown

Я слежу за Github https://github.com/remarkjs/react-markdown и пытаюсь добавить SyntaxHighlighter в свои фрагменты кода уценки. Я получаю указанную ниже ошибку при попытке использовать пример кода внутри функции, которую я использую для рендеринга с…
1 ответ

Выделение фрагмента кода curl в подсветке синтаксиса реакции

Я пытался выделить фрагмент кода curl в своем приложении для реагирования. Я использую react-syntax-highlighter для того же. Проблема в том, что код curl не выравнивается должным образом. под моим фрагментом кода. import SyntaxHighlighter from 'reac…
3 ответа

Реагируйте, как применить стиль внутри jsx

Я использую react-syntax-highlighter, и у меня есть одна проблема. Я пытаюсь написать некоторые стили внутри jsx, а именно paddingLeft: 0. Но проблема в том, что тема синтаксиса указана внутри стиля, выглядит это так <SyntaxHighlighter language="…
1 ответ

React-уценка и реактивная подсветка синтаксиса

как дела? Я создаю блог с ReactMarkdown и хочу отобразить пользовательский компонент для блоков кода: <ReactMarkdown children={content} rehypePlugins={[rehypeRaw]} components={{ code({ node, inline, children, className, ...props }) { return <P…
1 ответ

Подсветка синтаксиса реакции не работает с TailwindCSS

Я показываю содержимое блока здравомыслия, используя [@sanity/block-content-to-react](@sanity/block-content-to-react). Компонент BlockContent является оболочкой div с классом «проза». <div className="prose prose-zinc font-display prose-h1:font-no…
0 ответов

как добавить код в тег react-syntax-highlighter из другого компонента

У меня есть компонент React, который называется"UploadButton"который позволяет пользователю выбирать и загружать ZIP-файл. Когда файл загружен, компонент извлекает определенный файл JSON из ZIP и преобразует его в строку. Мне нужно найти способ отоб…
1 ответ

Невозможно использовать React Syntax Highlighter в Next.js 13 и Sanity v3

Здравствуйте, у меня проблема с моим проектом, использующим Sanity v3 и React SyntaxHighlighter. когда я используюRefactorбиблиотека для отображения моего кода в браузере, она работает, просмотрев учебник в Code Input by Sanity Но когда я хочу испол…
0 ответов

Все после фрагмента реакции имеет тот же цвет в коде VS (фрагмент реакции).

Как показывает стрелка... все после закрытого фрагмента имеет один и тот же странный цвет, в начале я думал, что это может быть проблема темы, но потом понял, что это не так. Мне действительно нужно решение для этого. Я новичок, чтобы реагировать к…
0 ответов

Next.JS использует модуль fs в компоненте, который не отображается напрямую

Моя цель — красиво отобразить код с помощью prismjs в приложении next.js. Мой код хранится в папке данных локально. Я использую пакеты react-syntax-highlighter и fs-extranpm. fs нельзя использовать напрямую, потому что он не работает в браузере, но …
1 ответ

React Syntax Highlighter выделяет только код JS

Я хочу выделить кое-какой код Ruby, но, хоть убей, он не работает. На самом деле, кажется, что это только подчеркивает JavaScript. import React from "react"; import atom from "node_modules/react-syntax-highlighter/dist/cjs/styles/hljs/a11y-dark"; im…