https://github.com/ezhlobo/pug-uses-variables

Find all JavaScript variables used in pug template
https://github.com/ezhlobo/pug-uses-variables

ast babel library pug pug-templates react

Last synced: 9 days ago
JSON representation

Find all JavaScript variables used in pug template

• Host: GitHub
• URL: https://github.com/ezhlobo/pug-uses-variables
• Owner: ezhlobo
• License: mit
• Created: 2017-09-17T10:45:30.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2023-01-04T00:46:04.000Z (almost 2 years ago)
• Last Synced: 2024-10-15T14:32:20.010Z (21 days ago)
• Topics: ast, babel, library, pug, pug-templates, react
• Language: JavaScript
• Size: 1.21 MB
• Stars: 2
• Watchers: 2
• Forks: 2
• Open Issues: 14
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# pug-uses-variables [![circleci](https://circleci.com/gh/ezhlobo/pug-uses-variables/tree/master.svg)](https://circleci.com/gh/ezhlobo/pug-uses-variables/tree/master)

Find all JavaScript variables used in pug template.

## Usage

```

$ npm install --save pug-uses-variables

```

```js

const { findVariablesInTemplate } = require('pug-uses-variables')

const pugTemplate = `

  ReactComponent(property=object[item])

    = content

    if condition === matcher

      p Truthy

`.trimRight()

const variables = findVariablesInTemplate(pugTemplate)

```

```js

// `variables` is equal:

[{

  value: 'ReactComponent',

  loc: {

    start: { line: 3,  column: 2 },

    end:   { line: 3,  column: 14 }

  }

}, {

  value: 'object',

  loc: {

    start: { line: 3,  column: 24 },

    end:   { line: 3,  column: 30 }

  }

}, {

  value: 'item',

  loc: {

    start: { line: 3,  column: 31 },

    end:   { line: 3,  column: 35 }

  }

}, {

  value: 'content',

  loc: {

    start: { line: 4,  column: 4 },

    end:   { line: 4,  column: 11 }

  }

}, {

  value: 'condition',

  loc: {

    start: { line: 6,  column: 5 },

    end:   { line: 6,  column: 14 }

  }

}, {

  value: 'condition',

  loc: {

    start: { line: 6,  column: 19 },

    end:   { line: 6,  column: 26 }

  }

}]

```

**Important**: templates should be right-trimmed. Usually it means that you have to execute `.trimRight` on your template-string as in the example above.

### Get variable names only

```js

const variableNames = variables.map(variable => variable.value)

// > ['ReactComponent', 'object', 'item', 'content', 'condition', 'matcher']

```

## Value

This plugin helps us to integrate [babel-plugin-transform-react-pug](https://github.com/pugjs/babel-plugin-transform-react-pug) and [eslint](http://eslint.org).

## Development

* `yarn test`

* `yarn lint`

## License

[MIT](https://tldrlegal.com/license/mit-license)