Skip to main content

A Vue lexer for Pygments

Project description

vue-lexer

Build Status

PyPI version

A Vue lexer for Pygments (based on jsx-lexer)

Installation

$ pip install vue-lexer

Usage with Sphinx

To use within Sphinx, simply specify vue for your code-block:

.. code-block:: vue

    <template>
      <p>{{ greeting }} World!</p>
    </template>

    <script>
    module.exports = {
      data: function () {
        return {
          greeting: 'Hello'
        }
      }
    }
    </script>

    <style scoped>
    p {
      font-size: 2em;
      text-align: center;
    }
    </style>

Usage with mkdocs

First, you need to create the CSS for the highlighting:

$ pygmentize -S default -f html -a .codehilite > code/pygments.css

Then, add the following to your mkdocs.yml:

markdown_extensions:
  - codehilite
extra_css: [pygments.css]

Now, you can use vue in your code blocks:

```vue
<template>
  <p>{{ greeting }} World!</p>
</template>

<script>
module.exports = {
  data: function () {
    return {
      greeting: 'Hello'
    }
  }
}
</script>

<style scoped>
p {
  font-size: 2em;
  text-align: center;
}
</style>
```

Examples

Example 1:

Example 2:

Example 3:

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

vue-lexer-0.0.4.tar.gz (2.9 kB view hashes)

Uploaded source

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page