jsx-lexer
=========
.. image:: https://travis-ci.org/fcurella/jsx-lexer.svg?branch=master
:target: https://travis-ci.org/fcurella/jsx-lexer
.. image:: https://coveralls.io/repos/github/fcurella/jsx-lexer/badge.svg?branch=master
:target: https://coveralls.io/github/fcurella/jsx-lexer?branch=master
A JSX lexer for Pygments
Installation
------------
.. code-block:: sh
$ pip install jsx-lexer
Usage with Sphinx
-----------------
To use within Sphinx, simply specify ``jsx`` for your ``code-block``::
.. code-block:: jsx
const BlogTitle = ({ children }) => (
<h3>{children}</h3>
);
// class component
class BlogPost extends React.Component {
renderTitle(title) {
return <BlogTitle>{title}</BlogTitle>
};
render() {
return (
<div className="blog-body">
{this.renderTitle(this.props.title)}
<p>{this.props.body}</p>
</div>
);
}
}
Usage with mkdocs
-----------------
First, you need to create the ``CSS`` for the highlighting:
.. code-block:: bash
$ pygmentize -S default -f html -a .codehilite > code/pygments.css
Then, add the following to your ``mkdocs.yml``:
.. code-block:: yaml
markdown_extensions:
- codehilite
extra_css: [pygments.css]
Now, you can use ``jsx`` in your code blocks::
```jsx
const BlogTitle = ({ children }) => (
<h3>{children}</h3>
);
// class component
class BlogPost extends React.Component {
renderTitle(title) {
return <BlogTitle>{title}</BlogTitle>
};
render() {
return (
<div className="blog-body">
{this.renderTitle(this.props.title)}
<p>{this.props.body}</p>
</div>
);
}
}
```
Usage with Overleaf
-------------------
First, add the minted package in your main file:
.. code-block:: latex
\usepackage{minted}
Then, download the `lexer.py`_ file from this project, and place it in your root folder in Overleaf.
.. _lexer.py: jsx/lexer.py
Now, you can use ``{lexer.py:JsxLexer -x}`` in front of your minted code blocks:
.. code-block:: latex
\begin{minted}{lexer.py:JsxLexer -x}
const BlogTitle = ({ children }) => (
<h3>{children}</h3>
);
// class component
class BlogPost extends React.Component {
renderTitle(title) {
return <BlogTitle>{title}</BlogTitle>
};
render() {
return (
<div className="blog-body">
{this.renderTitle(this.props.title)}
<p>{this.props.body}</p>
</div>
);
}
}
\end{minted}
You can find an example of the lexer in use on Overleaf here: `https://www.overleaf.com/read/xvsytqzkvdjb`
Raw data
{
"_id": null,
"home_page": "https://github.com/fcurella/jsx-lexer",
"name": "jsx-lexer",
"maintainer": "",
"docs_url": null,
"requires_python": "",
"maintainer_email": "",
"keywords": "pygments highlight jsx react",
"author": "Flavio Curella",
"author_email": "flavio.curella@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/37/88/8678fcb9f7db1aa7efb338d58f320203b74e865a12583c108291ed9d3df7/jsx-lexer-2.0.1.tar.gz",
"platform": null,
"description": "jsx-lexer\n=========\n\n.. image:: https://travis-ci.org/fcurella/jsx-lexer.svg?branch=master\n :target: https://travis-ci.org/fcurella/jsx-lexer\n\n.. image:: https://coveralls.io/repos/github/fcurella/jsx-lexer/badge.svg?branch=master\n :target: https://coveralls.io/github/fcurella/jsx-lexer?branch=master\n\nA JSX lexer for Pygments\n\nInstallation\n------------\n.. code-block:: sh\n\n $ pip install jsx-lexer\n\nUsage with Sphinx\n-----------------\n\nTo use within Sphinx, simply specify ``jsx`` for your ``code-block``::\n\n .. code-block:: jsx\n\n const BlogTitle = ({ children }) => (\n <h3>{children}</h3>\n );\n // class component\n class BlogPost extends React.Component {\n renderTitle(title) {\n return <BlogTitle>{title}</BlogTitle>\n };\n render() {\n return (\n <div className=\"blog-body\">\n {this.renderTitle(this.props.title)}\n <p>{this.props.body}</p>\n </div>\n );\n }\n }\n\nUsage with mkdocs\n-----------------\n\nFirst, you need to create the ``CSS`` for the highlighting:\n\n.. code-block:: bash\n\n $ pygmentize -S default -f html -a .codehilite > code/pygments.css\n\nThen, add the following to your ``mkdocs.yml``:\n\n.. code-block:: yaml\n\n markdown_extensions:\n - codehilite\n extra_css: [pygments.css]\n\nNow, you can use ``jsx`` in your code blocks::\n\n ```jsx\n const BlogTitle = ({ children }) => (\n <h3>{children}</h3>\n );\n // class component\n class BlogPost extends React.Component {\n renderTitle(title) {\n return <BlogTitle>{title}</BlogTitle>\n };\n render() {\n return (\n <div className=\"blog-body\">\n {this.renderTitle(this.props.title)}\n <p>{this.props.body}</p>\n </div>\n );\n }\n }\n ```\n\nUsage with Overleaf\n-------------------\n\nFirst, add the minted package in your main file:\n\n.. code-block:: latex\n\n \\usepackage{minted}\n\nThen, download the `lexer.py`_ file from this project, and place it in your root folder in Overleaf.\n\n.. _lexer.py: jsx/lexer.py\n\nNow, you can use ``{lexer.py:JsxLexer -x}`` in front of your minted code blocks:\n\n.. code-block:: latex\n\n \\begin{minted}{lexer.py:JsxLexer -x}\n const BlogTitle = ({ children }) => (\n <h3>{children}</h3>\n );\n // class component\n class BlogPost extends React.Component {\n renderTitle(title) {\n return <BlogTitle>{title}</BlogTitle>\n };\n render() {\n return (\n <div className=\"blog-body\">\n {this.renderTitle(this.props.title)}\n <p>{this.props.body}</p>\n </div>\n );\n }\n }\n \\end{minted}\n\nYou can find an example of the lexer in use on Overleaf here: `https://www.overleaf.com/read/xvsytqzkvdjb`\n",
"bugtrack_url": null,
"license": "MIT License",
"summary": "A JSX lexer for Pygments",
"version": "2.0.1",
"project_urls": {
"Homepage": "https://github.com/fcurella/jsx-lexer"
},
"split_keywords": [
"pygments",
"highlight",
"jsx",
"react"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "2f2d6369d2f3ce55cee200202e37435601e5e50d575c2f8ffb367129e584f3f5",
"md5": "15a5aa237763db852bf9fd28fb08fded",
"sha256": "508a08757764356aa36fd703596fdd59f789104f44b6568c7a14e27e62e57ad4"
},
"downloads": -1,
"filename": "jsx_lexer-2.0.1-py2.py3-none-any.whl",
"has_sig": false,
"md5_digest": "15a5aa237763db852bf9fd28fb08fded",
"packagetype": "bdist_wheel",
"python_version": "py2.py3",
"requires_python": null,
"size": 4071,
"upload_time": "2023-05-16T15:16:02",
"upload_time_iso_8601": "2023-05-16T15:16:02.786965Z",
"url": "https://files.pythonhosted.org/packages/2f/2d/6369d2f3ce55cee200202e37435601e5e50d575c2f8ffb367129e584f3f5/jsx_lexer-2.0.1-py2.py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "37888678fcb9f7db1aa7efb338d58f320203b74e865a12583c108291ed9d3df7",
"md5": "f66f62fec033455368da6d33f11040b3",
"sha256": "0d9aa653e74d7973d74021dde8349896c0df094d8e40349b92b35e0930ed7f71"
},
"downloads": -1,
"filename": "jsx-lexer-2.0.1.tar.gz",
"has_sig": false,
"md5_digest": "f66f62fec033455368da6d33f11040b3",
"packagetype": "sdist",
"python_version": "source",
"requires_python": null,
"size": 4007,
"upload_time": "2023-05-16T15:16:04",
"upload_time_iso_8601": "2023-05-16T15:16:04.613254Z",
"url": "https://files.pythonhosted.org/packages/37/88/8678fcb9f7db1aa7efb338d58f320203b74e865a12583c108291ed9d3df7/jsx-lexer-2.0.1.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2023-05-16 15:16:04",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "fcurella",
"github_project": "jsx-lexer",
"travis_ci": false,
"coveralls": true,
"github_actions": true,
"tox": true,
"lcname": "jsx-lexer"
}
JSON
