Skip to content

NPM packaging #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jun 1, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
77 changes: 68 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
# Apex - a language grammar for the [Salesforce Platform](https://developer.salesforce.com)

[![NPM](https://nodei.co/npm/highlightjs-apex.png)](https://npmjs.org/package/highlightjs-apex)

## Demo

The below screenshot was captured from a [demo webpage](demo/testcode.html) after dropping `highlight.min.js` to a `dist` folder.
Expand All @@ -8,43 +10,100 @@ The below screenshot was captured from a [demo webpage](demo/testcode.html) afte

## Usage

Simply include the Highlight.js library in your webpage, then load this module.
Simply include the Highlight.js library in your webpage or Node app, then load this module.

### Static website or simple usage

Simply load this module after loading Highlight.js. You'll use the minified version found in the `dist` directory. This module is just a CDN build of the language, so it will register itself as the Javascript is loaded.

```html
<script type="text/javascript" src="/path/to/highlight.min.js"></script>
<script type="text/javascript" src="/path/to/highlightjs-apex/dist/apex.min.js"></script>
<script type="text/javascript" src="/path/to/apex.min.js"></script>
<!-- Use any stylesheet you'd like - though it's best to choose from those in highlightjs core repo -->
<link rel="stylesheet" href="/path/to/highlightjs-apex/demo/highlight.css" />
<link rel="stylesheet" href="https://unpkg.com/highlightjs/styles/vs.css" />
<script type="text/javascript">
hljs.highlightAll();
</script>
```

For more details of the usage see [Highlight.js main page](https://github.com/highlightjs/highlight.js#highlightjs).
This will find and highlight code inside of `<pre><code>` tags; it tries to detect the language automatically. If automatic detection doesn’t work for you, you can specify the language in the `class` attribute:

```html
<pre>
<code class="language-apex">
...
</code>
</pre>
```

For more details see [Highlight.js main page](https://github.com/highlightjs/highlight.js#highlightjs).

### Using directly from the UNPKG CDN

```html
<script type="text/javascript"
src="https://unpkg.com/highlightjs-apex/dist/apex.min.js"></script>
```

- More info: <https://unpkg.com>

### With Node or another build system

If you're using Node / Webpack / Rollup / Browserify, etc, simply require the language module, then register it with Highlight.js.

```javascript
var hljs = require('highlight.js');
var hljsApexTxt = require('highlightjs-apex');
var hljs = require('highlightjs');
var hljsApex = require('highlightjs-apex');

hljs.registerLanguage('apex', hljsApexTxt);
hljs.registerLanguage('apex', hljsApex);
hljs.highlightAll();
```


### React

You need to import both Highlight.js and third-party language like Apex:

```js
import React, {Component} from 'react'
import 'highlight.js/scss/vs.scss' # your favourite theme
import apex from './apex'
import hljs from 'highlight.js'
hljs.registerLanguage('apex', apex);

class Highlighter extends Component
{
constructor(props)
{
super(props);
hljs.highlightAll();
}

render()
{
let {children} = this.props;
return
{
<pre ref={(node) => this.node = node}>
<code className="language-apex">
{children}
</code>
</pre>
}
}
}

export default Highlighter;
```

## License

Highlight.js is released under the BSD 3-Clause License. See [LICENSE](/LICENSE) file for details.
Highlight.js is released under the BSD 3-Clause License. See [LICENSE](https://github.com/highlightjs/highlight.js/blob/main/LICENSE) file for details.
Highlightjs-apex is released under the MIT License. See [LICENSE](/LICENSE.md) file for details.

## Author

[David Schach](https://github.com/dschach)
David Schach [[David Schach](https://github.com/dschach)](https://github.com/dschach)

## Contribution

Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@
"scripts": {
"test": "./node_modules/.bin/mocha --reporter spec",
"mocha": "mocha test/markup",
"changelog": "auto-changelog --output HISTORY.md --hide-credit -p --commit-limit false"
"changelog": "auto-changelog --output HISTORY.md --hide-credit -p --commit-limit false",
"npm-patch": "npm version patch && npm publish"
},
"repository": {
"type": "git",
Expand Down